Cufon Hover Проблемы - PullRequest
Новая
       17

Cufon Hover Проблемы

0 голосов
/ 01 апреля 2012

У меня проблемы с изменением цвета градиента для куфона (при наведении). Работает нормально как для (не зависания), но (при зависании) не меняет цвет градиента. Буду признателен, если кто-нибудь сможет мне помочь?

Часть куфона: 

    Cufon.replace('h1', {
    color: '-linear-gradient(white, black)',
    fontFamily: 'Scriptina',
    textShadow: '1px 1px rgba(0, 0, 0, 0.2)'
});
Cufon.replace('#nav a', {
    hover: true
});
Cufon('#content h2', {
    color: '-linear-gradient(#b7dded, 0.2=#70ceef, 0.5=#20b4e2, #b1dbeb)',
    hover: {
        textShadow: '2px 2px red',
        color: '-linear-gradient(black, white)'
    }
});

Из HTML: 

     <nav class="mid">
      <ul class="tabs">
           <li>
                <a href="#" class="defaulttab" rel="tabs1">
                     <div class="lineRight">
                          <h5>TEXT 1</h5>
                          <p>Sub-Text1</p>
                     </div>
                </a>
           </li>
           <li>
                <a href="#" rel="tabs2">
                     <div class="lineMiddle">
                          <h5>TEXT 2</h5>
                          <p>Sub-Text2</p>
                     </div>
                </a>
           </li>
           <li>
                <a href="#" rel="tabs3">
                     <div class="lineMiddle ook">
                          <h5>TEXT 3</h5>
                          <p>Sub-Text3</p>
                     </div>
                </a>
           </li>
           <li>
                <a href="#" rel="tabs4">
                     <div class="lineLeft">
                          <h5>TEXT 4</h5>
                          <p>Sub-Text4</p>
                     </div>
                </a>
           </li>
      </ul>
 </nav>

Ответы [ 2 ]

0 голосов
/ 02 апреля 2012

Из того, что я могу извлечь из спецификации (https://github.com/sorccu/cufon/wiki/Styling),, вам нужно явно включить hover: 

Cufon.replace('h1', {
    hover: true
});

С учетом сказанного, почему бы просто не использовать @font-face?

0 голосов
/ 02 апреля 2012

из того, что я знаю, cufon hover работает только по ссылкам. Вы можете использовать что-то вроде этого 

Cufon.replace('h1', { fontFamily: 'yourfont' });
Cufon('#yourid a', {
hover: {
color: 'green'
}
});

Ваш HTML будет выглядеть так 

<a href="#">
<h5>h5 text</h5>
<p>some text</p>
</a>

это будет работать;)

...