: hover with nested sIFR element
I have the following html:
<li><a href="#"><span class="font Berthold-light">1</span>Consectetur adipiscing elit risus.</a></li>
The number inside span
is replaced with sIFR, but I would like it to change color to a:hover
. In CSS it will work like this:
a:hover span { color: #0fb5ef; }
Is there a way to do the same with sIFR?
a source to share
Below is a snippet of my sifr-config.js that handles the hover link effect. try it and adapt for your use.
sIFR.replace ({
selector: 'h3',
src: 'flash / din.swf',
highsrc: 'flash / din.swf',
css: {
'.sIFR-root': {'text-transform': 'uppercase ',' color ':' # FEBF10 ',' font-weight ':' bold ',' font-size ':' 12px '},
' a ': {' text-decoration ':' none ',' color ' : '# FEBF10'},
'a: link': {'text-decoration': 'none', 'color': '# FEBF10'},
'a: hover': {'text-decoration': 'underline' , 'color': '# FEBF10'},
'a: visited': {'text-decoration': 'none', 'color': '# FEBF10'},
'a: active': {'text-decoration': 'none', 'color': '# FEBF10 '}
},
wmode: 'transparent',
paddingTop: 0
});
a source to share