sifr — Как заставить его работать со ссылками .active ul

StackOverflow https://stackoverflow.com/questions/1606691

  •  05-07-2019
  •  | 
  •  

Вопрос

У меня есть сценарий SIFR, который скрывает основные элементы навигации следующим образом:

[code]
/*********************
* sIFR configuration
**********************/

var itc = {
    src: '/assets/js/sifr3/demo/font2.swf'
    ,ratios: [7, 1.32, 11, 1.31, 13, 1.24, 14, 1.25, 19, 1.23, 27, 1.2, 34, 1.19, 42, 1.18, 47, 1.17, 48, 1.18, 69, 1.17, 74, 1.16, 75, 1.17, 1.16]
}

sIFR.activate(itc);
sIFR.useStyleCheck = false;
sIFR.replace(itc, {
    selector: 'h2, #primary_nav ul li'
    ,css:[
        '.sIFR-root { font-size:14px;font-weight:normal; }',
        ,'#primary_nav ul li a { color:#000000; text-decoration: none; }'
        ,'#primary_nav ul li a:hover { color: #000000;  text-decoration:underline; background-color:#000000; }'
        ,'#primary_nav ul li.active a { color:#000000;  text-decoration:underline;}'
    ]
    ,wmode: 'transparent'
    ,fitExactly:true
    ,forceClear:true
    ,forceSingleLine:true
}); 
[/code]

Однако «li.active a» применяется к каждый пункт меню.Это не то, чего я хочу.

Я хочу, чтобы класс .active применялся только к тем, у кого есть этот класс.

«#primary_nav ul li.active a» используется в пункте списка меню, в котором вы находитесь.

то есть:

[code]
<li class="active"><a href="#">Home</a></li>
<li><a href="#">News</a></li>
<li><a href="#">Some other menu item</a></li>
[/code]

Как заставить SIFR применять .active только к активному элементу списка?

Спасибо.

Это было полезно?

Решение

Сначала выполните замену для #primary_nav ul li.active который имеет особый стиль, и затем заменить все остальные элементы списка.

Также в правилах CSS замену повторять нельзя #primary_nav ul li, просто используйте a вместо.

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top