2014-01-03 4 views
2

Первоисточник & Пример:Scrolling News Ticker Jquery - Проблемы

http://www.htmldrive.net/items/show/397/Vertical-Scrolling-News-Ticker-With-jQuery-jCarouse

Здравствуйте снова !! Scrolling News Ticker Jquery с некоторыми вопросами:


Первый выпуск: Internet Explorer Сообщение об ошибке

"Объект не поддерживает это свойство или метод" Line: 269: Линия 269)

  ticker.mouseenter(function() { // <---Line: 269 
      //stop current animation 
      ticker.children().stop(); 

     }); 

  • Второй выпуск: Единственный способ щелчка на опции новостей (для ссылки на страницу) - это текстовое название, которое на примере веб-сайта имеет синий цвет. Я хотел бы, чтобы у пользователя была возможность щелкнуть по всему разделу опции, которая содержит изображение .

  • Третий выпуск: Когда новости свитки выглядит все в одном, есть способ, чтобы добавить строку, чтобы отделить каждую секцию.

  • Forth Выпуск: Есть ли способ, чтобы приостановить автоматическую прокрутку, когда пользователь помещает курсор над участком?
  • Есть ли способ добавить больше текста под заголовком и категорией?

Вот сам скрипт с проблемой IE выделенной со стрелкой на правой стороне ниже:

<script type="text/javascript"> 
     $(function() { 

    //cache the ticker 
    var ticker = $("#ticker"); 

    //wrap dt:dd pairs in divs 
    ticker.children().filter("dt").each(function() { 

     var dt = $(this), 
     container = $("<div>"); 

     dt.next().appendTo(container); 
     dt.prependTo(container); 

     container.appendTo(ticker); 
    }); 

    //hide the scrollbar 
    ticker.css("overflow", "hidden"); 

    //animator function 
    function animator(currentItem) { 

     //work out new anim duration 
     var distance = currentItem.height(); 
     duration = (distance + parseInt(currentItem.css("marginTop")))/0.020; 

     //animate the first child of the ticker 
     currentItem.animate({ marginTop: -distance }, duration, "linear", function() { 

     //move current item to the bottom 
     currentItem.appendTo(currentItem.parent()).css("marginTop", 0); 

     //recurse 
     animator(currentItem.parent().children(":first")); 
     }); 
    }; 

    //start the ticker 
    animator(ticker.children(":first")); 

    //set mouseenter 
    ticker.mouseenter(function() { 


    ticker.mouseenter(function() { // <---Line: 269 
     //stop current animation 
     ticker.children().stop(); 

    }); 

    //set mouseleave 
    ticker.mouseleave(function() { 

      //resume animation 
    animator(ticker.children(":first")); 

    }); 
     }); 
    </script> 

Я глубоко признателен !!

ответ

2

, чтобы добавить строку для разделения каждого элемента добавить border-bottom:1px solid black; в css.

после того, как прочитал ваш вопрос, я хотел бы показать вам метод javascript, который я использовал на своем сайте, и останавливается при наведении мыши.

<div id="marqueecontainer" onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=marqueespeed"> 
<div id="vmarquee" style="position: absolute; width: 98%;"> 

<!--YOUR SCROLL CONTENT HERE--> 

<!--YOUR SCROLL CONTENT HERE--> 

</div> 
</div><style type="text/css"> 

#marqueecontainer{ 
position: relative; 
    width: 200px; /*marquee width */ 
height: 200px; /*marquee height */ 
    background-color: white; 
overflow: hidden; 
border: 3px solid orange; 
padding: 2px; 
padding-left: 4px; 
} 

</style> 
<script type="text/javascript"> 

var delayb4scroll=2000 //Specify initial delay before marquee starts to scroll on page (2000=2 seconds) 
    var marqueespeed=2 //Specify marquee scroll speed (larger is faster 1-10) 
    var pauseit=1 //Pause marquee onMousever (0=no. 1=yes)? 

    var copyspeed=marqueespeed 
    var pausespeed=(pauseit==0)? copyspeed: 0 
    var actualheight='' 

    function scrollmarquee(){ 
    if (parseInt(cross_marquee.style.top)>(actualheight*(-1)+8)) 
    cross_marquee.style.top=parseInt(cross_marquee.style.top)-copyspeed+"px" 
    else 
    cross_marquee.style.top=parseInt(marqueeheight)+8+"px" 
    } 

    function initializemarquee(){ 
     cross_marquee=document.getElementById("vmarquee") 
     cross_marquee.style.top=0 
     marqueeheight=document.getElementById("marqueecontainer").offsetHeight 
     actualheight=cross_marquee.offsetHeight //height of marquee content (much of which is hidden from view) 
     if (window.opera || navigator.userAgent.indexOf("Netscape/7")!=-1){ //if Opera or Netscape 7x, add scrollbars to scroll and exit 
     cross_marquee.style.height=marqueeheight+"px" 
     cross_marquee.style.overflow="scroll" 
     return 
     } 
     setTimeout('lefttime=setInterval("scrollmarquee()",30)', delayb4scroll) 
     } 

    if (window.addEventListener) 
     window.addEventListener("load", initializemarquee, false) 
    else if (window.attachEvent) 
    window.attachEvent("onload", initializemarquee) 
    else if (document.getElementById) 
    window.onload=initializemarquee 


    </script> 

вы можете просмотреть демо на here

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

  • Нет связанных вопросов^_^