Image Picker: Ability to add custom CSS to this widget

Hi,

Please could you allow the line (square) that marks around the selected image to be configurable in both colour and thickness. I think currently the selected image does not stand out enough.

Thanks

Paul

Hi Paul,

Can you please confirm first that you meant the border box around the selected image in the image picker widget..

Example in your jotform http://form.jotformpro.com/form/51256391670961

it seems it is very much possible using custom injected CSS code like this

Please confirm first if that was what you were looking for and we will check for the correct CSS code to achieve it

Thanks.

Hi, 

Yes that is exactly what I want to do. Please advise the CSS code.

Thanks

Paul

Regarding changing the border around the selection image I'm afraid the changes will not apply to the image picker widget, this is because the widget is rendered within in it's own iframe, and elements within an iframe are not affected by the main page styling.

I have opened a feature request ticked to allow the addition of custom CSS within this widget.

Hi Sammy,

Ok thanks. Please can you let me know when this feature is available.

Kind regards

Paul

Hi Paul,

We have already submitted a feature request ticket for the feature.

We will notify you here for any updates/news on the status of the feature request when available.

Thanks.

Just a thought for your developers when they are looking at this. It would be a good idea if the widget would also optionally apply an opacity mask (say 50%) over the top of the other images (non-selected)

Paul

Your additional information regarding this request has been noted.  Though I cannot say when this will be addressed, we will let you know as soon as we have any further information.

Hello, 

You can now modify the images using the Custom CSS tab in the widget settings: 

You can paste in the following code into the Custom CSS box to utilize opacity: 

.divimg.selected {

    opacity: 1;

}

.divimg {

    opacity: .5;

}

If you need assistance with styling the widget further - please let us know - 

Thanks!

how do you add a custom css field to an image?  i know how to add it to the form, but how do you add it to an image?

div#cid_12 {

    margin-left: -58px;

}

div#cid_14 {

    margin-left: -85px;

}

@ CashAngels your question will be answered here:

http://www.jotform.com/answers/755051 

Please avoid opening several threads regarding the same situation. 

Thank you