Adding a bit of colour Options

[Zugfrig]

G'day I found a script online that I like and was wondering that when a user sorts the order they like if the is any way I could colour the first 18 choices in green no matter who they put in the first 18..

All others outside the first 18 would stay as default color.


Example is here http://tpctestsite.weebly.com/9000.html

[pandy]

Probably. But it's jQuery which means it's hard to untangle for someone who isn't very much into jQuery and its ins and outs. Had it been "normal" JavaScript someone, maybe Christian, had probably been able to modify it for you.

[Christian J]

Couldn't CSS selectors be used for that? E.g. the :first-child and its subsequent 17 siblings? Pandy knows this better than me.

[pandy]

If you make the script add IDs with ascending values to the OPTIONs, I'll provide the CSS.

[Frederiek]

This will do the trick (only for browsers that support CSS3 selectors, http://caniuse.com/#search=nth-child ).

CODE

#sortableList li:nth-child(-n+18) {
    background-color: green;
    color: #fff;
}

[Zugfrig]

This will do the trick (only for browsers that support CSS3 selectors, http://caniuse.com/#search=nth-child ).

CODE

#sortableList li:nth-child(-n+18) {
    background-color: green;
    color: #fff;
}

this looks simple and promising...... ok now don't laugh but where exactly in the origianl script do i paste it?

[Zugfrig]

Just an update, i posted your srcipt back to Jotform in hope of a wuick reply and they have replied as shown here http://www.jotform.com/answers/304806-orde...age=10732640770

can we get around them? or can we "recreate" it not in this iframe? or widget? form...... im lost

This post has been edited by Zugfrig: Dec 16 2013, 09:27 PM

[pandy]

this looks simple and promising...... ok now don't laugh but where exactly in the origianl script do i paste it?

Not in a script. In your style sheet. And it won't work in all browsers since it's CSS3.

[Zugfrig]

this looks simple and promising...... ok now don't laugh but where exactly in the origianl script do i paste it?

Not in a script. In your style sheet. And it won't work in all browsers since it's CSS3.

Hi, again I'll plead my ignorance and ask what my style sheet is...... I did however read Fredrick's link about css3 browsers and given there only 10 users I've confirmed with them what they are using and I'm happy with what browsers css3 covers...

Might be best to read my other post where I have explained myself better. http://forums.htmlhelp.com/index.php?showtopic=19318

[pandy]

You use no less than 8 style sheets for the page if I counted right.

See http://htmlhelp.com/reference/css/ .

BTW some of them are in BODY. They should be in HEAD.

[Frederiek]

Agreed, it's a lot. And I wonder if all that is really needed.

In this case, my CSS snippet should be in the CSS file for the iframe page (orderPicker.css). But since that comes from another domain (like other CSS files), he has no access to it. And the snippet I posted, won't work when put outside the iframe page. I already tried. Besides, the discussion now continues at http://forums.htmlhelp.com/index.php?showtopic=19318 .