2015-12-26 6 views
2
<!DOCTYPE html> 
    <html> 
    <head> 
    <title>HTML marquee Tag</title> 

    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <!-- Bootstrap --> 
    <link href="css/bootstrap.min.css" rel="stylesheet" media="screen"> 
    <link href="css/bootstrap-theme.min.css" rel="stylesheet" media="screen"> 

    <!-- Main CSS --> 
    <link href="style.css" rel="stylesheet" media="screen"> 

    <!-- Responsive Framework --> 
    <link href="responsive.css" rel="stylesheet" media="screen">   

    <!-- Fontawesome CSS --> 
    <link href="font-awesome-4.5.0/css/font-awesome.min.css" rel="stylesheet">  
    <link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.no-icons.min.css" rel="stylesheet"> 
    <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet"> 


    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 


    <!-- scrollbox Script --> 
    <script src="js/jquery.scrollbox.js"></script> 


    <script type="text/javascript"> 

     $('#demo').scrollbox({ 
      linear: true, 
      step: 1, 
      delay: 0, 
      speed: 100 
     }); 

     </script>  

     </head> 
     <body> 

     <div class="row"> 

     <div class="col-lg-6" id="demo"> 
      <ul> 
      <li><a href="#">This text will scroll from bottom to up</a></li> 
      <li><a href="#">This text will scroll from bottom to up</a></li> 
      <li><a href="#">This text will scroll from bottom to up</a></li> 
     </ul> 
     </div> 





    </div> 

    </body> 
    </html> 

Это мой оригинальный код для прокрутки. Он еще не работает ..... Сначала я подключил google apis, затем скрипт прокрутки, импортированный из Github, затем функцию и список с идентификатором div id = "demo"Прокрутка jquery не работает?

+0

'$ (функция() {});' является сокращением для ' $ (document) .ready (function() {}); ' – mplungjan

+0

' 'должен быть включен после ссылки на jquery. Проверьте консоль на наличие ошибок. '.scrollbox не является функцией ...' –

ответ

2
  1. Убедитесь, что Jquery загружается до того, как scrollbox.js
  2. использовать некоторые из CSS с сайта scrollbox

Я добавил несколько вещей, как CSS и более элементов для прокрутки.

Тогда я импортировал scrollbox из GitHub и изменил стиль

$('#demo').scrollbox({ 
    linear: true, 
    step: 1, 
    delay: 0, 
    speed: 100 
}); 

и теперь он работает

FIDDLE

+0

Отображается журнал ошибок: Uncaught TypeError: $ (...). scrollbox не является функцией –

2

Ваши <script> теги должны быть перевернутый, так как scrollbox.js зависит от JQuery:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
<script src="js/jquery.scrollbox.js"></script> 

Вообще говоря, когда что-то ожидать не произойдет, то первое, что нужно проверить, является журнал регистрации ошибок в инструментах разработчика (просто нажмите F12 в IE, FF или Chrome).

+0

Отображается журнал ошибок: Uncaught TypeError: $ (...). scrollbox не является функцией –

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