2015-09-16 6 views
1

Я пробую эффект как «новости», где текст будет каждые 5 секунд fadeOut и следующий текст будет отображаться на предыдущей позиции. Но у меня есть link в массивах и я не могу нажать на него и выбрать его тоже. Подобно тексту не будет текст, а изображение или слайдер.Как нажимать на ссылку из массива с эффектом?

Вот мой код:

$(document).ready(function() { 
 
    var pages = ["<li class='active'><a id='click' href='http://www.seznam.cz'>link1</a></li>", "<li class='active'><a href='#'>link2</a></li>", "<li class='active'><a href='#'>link3</a></li>"] 
 
    var index = 0; 
 
    setInterval(function() { 
 
    $("#ul_news").html(pages[index]); 
 
    index++; 
 
    if (index >= pages.length){ 
 
     index = 0; 
 
    } 
 
    $(".active").delay(4000).fadeOut(1000); 
 
    }, 5000); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<ul id="ul_news"> 
 
</ul>

Здесь он работает, но он не работает на моем сайте: My Website

Можете ли вы сказать мне, что отличается от этого кода и код на моем сайте?

ответ

2

Это не работает, потому что есть div, перекрывающий его. (<div class="Menu">)
Изменить высоту .Menu на нужную высоту вместо 768px.

.Menu { 
    height: 80px; 
    left: 0; 
    position: absolute; 
    top: 0; 
    width: 100%; 
    z-index: 18; 
} 
1

В вашем сайте <div class="menu"> перекрывается ссылки, установить высоту .menu для авто

.Menu { 
    height: auto; 
    left: 0; 
    position: absolute; 
    top: 0; 
    width: 100%; 
    z-index: 18; 
} 
+0

Sure! Спасибо, что ответили. Я теряю в своем коде, потому что все находится в позиции **: абсолютная ** –

Смежные вопросы