Hi,
I am currently struggling with sIFR and a:hover. My problem site is hosted at http://irene.huditsch.info
I have the following HTML code:
<body id="irene-huditsch-info">
<div id="header">
<h1>Irene Huditsch</h1>
<div id="top-nav">
<ul>
<li id="impressum">
<a href="impressum.html" rel="index">Impressum</a>
</li>
<li id="kontakt">
<a href="kontakt.html">Kontakt</a>
</li>
</ul>
</div>
...
My sIFR-config.js looks like:
sIFR.replace(braganza, {
selector: 'div#top-nav a',
css: '.sIFR-root { background-color: transparent; color: #FFFFFF; line-height: 13px; font-size: 11px; text-decoration: underline; cursor: pointer; } .sIFR-root:hover { color: #592b02; }',
wmode: 'transparent'
});
But the hover doesn't take effect. I tried different solution with no success either.
When I write
sIFR.replace(braganza, {
selector: 'div#top-nav li',
css: 'a { background-color: transparent; color: #FFFFFF; line-height: 13px; font-size: 11px; text-decoration: underline; cursor: pointer; } a:hover { color: #592b02; }',
wmode: 'transparent'
});
(which seems logical to me), the list items are not rendered at all.
Could you please give me an advice how to do it correctly with the structure given?
Thanks, Roman