Hello! As I wrote earlier, I make a prototype of an online business card designer, which can be viewed at http://vv.vipvizitka.in.ua/po/index2.html . Also attached is an image of the site page to the question. Here's what I want to do: Remove the "Font Settings" , but when the user focuses on any form field, on the left, the "Font Settings" block appears under this field. When the field loses focus, the Font Settings block disappears. Can you please tell me how best to implement this? Using jQuery?

In the picture, the “Font Settings” block is highlighted with a red frame. Only I thought to display right below the field, but what do you think? Will using hide and show methods be enough? Online Business Card Designer

    1 answer 1

    It is enough just to tie the event to the input when you get the focus, but the usual show / hide does not get off, because on the basis of the task for each element has its own font. Consequently, it is possible to make one block of font settings, when receiving the focus of any element from the left column in accordance with it, make different values ​​in the font settings. In other words, for example, the surname field name = "surname", when receiving focus, #fontsettings is displayed, each change of fields in #fontsettings is entered into the corresponding fontsettings array type ['surname'] ['fontsize']. After the output, we can get the font parameters for any field.

    As for the display of these font settings, it’s not very successful, not all users will understand that these settings apply to this field, you can add some arrows, but you shouldn’t place them directly under the field either, since if it is a list of fields changing height is not good.