2014-11-15 3 views
1

Я прочитал и не мог найти решение с учетом моей проблемыUncaught TypeError: не определено не является функцией пятно автомобиля

Я пытаюсь получить гладкую карусель работать. Я получил его на работу на jsbin показано здесь: http://jsbin.com/gojozobemi/1/edit?html,output

Однако при работе на моем рабочем столе отображается сообщение об ошибке в консоли Дев, говоря «Uncaught TypeError: не определено не является функцией» Heres часть кода моего рабочего стола в

$(document).ready(function(){ 
 
    $('.single-items').slick({ 
 
     dots: true, 
 
     infinite: true, 
 
     speed: 300, 
 
     slidesToShow: 1, 
 
     adaptiveHeight: true 
 
    }); 
 
});
<div class="single-items"> 
 
    <div> 
 
     <img src="http://wallpapercartoon.com/wp-content/uploads/2014/07/o-DOUG-facebook.jpg"> 
 
    </div> 
 
    <div> 
 
     <img src="http://img3.wikia.nocookie.net/__cb20130803215442/nickelodeon/images/e/e2/Tumblr_lvjvhxwDiM1r6hffko1_400.jpg"> 
 
    </div> 
 

 
    <div> 
 
     <img src="http://fc02.deviantart.net/fs70/f/2013/303/b/4/pork_chop_by_barontremaynecaple-d6sdm6s.jpg"> 
 
    </div> 
 
</div>

Я озадачен, почему это будет работать на JSBin, а не на моем рабочем столе, любая помощь будет оценена

<!DOCTYPE html> 
 
<!--[if IE 9]><html class="lt-ie10" lang="en" > <![endif]--> 
 
<html class="no-js" lang="en"> 
 

 
<head> 
 
    <meta charset="utf-8"> 
 
    <!-- If you delete this meta tag World War Z will become a reality --> 
 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
 
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script> 
 
    <title>Coffee Site</title> 
 

 
    <link rel="stylesheet" href="css/normalize.css"> 
 
    <link rel="stylesheet" href="css/foundation.css"> 
 
    <link rel="stylesheet" href="css/app.css"> 
 
    <link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/jquery.slick/1.3.15/slick.css" /> 
 

 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
    <script src="js/vendor/modernizr.js"></script> 
 
    <script src="js/slickini.js"></script> 
 
</head> 
 

 
<body> 
 
    <div class="contain-to-grid sticky"> 
 
    <nav class="top-bar" data-topbar role="navigation"> 
 
     <ul class="title-area"> 
 
     <li class="name"> 
 
      <h1><a href="#">Coffee Site</a></h1> 
 
     </li> 
 
     <!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone --> 
 
     <li class="toggle-topbar menu-icon"><a href="#"><span>Menu</span></a> 
 
     </li> 
 
     </ul> 
 

 
     <section class="top-bar-section"> 
 
     <!-- Right Nav Section --> 
 
     <ul class="right"> 
 
      <li class="has-form"> 
 
      <div class="row collapse"> 
 
       <div class="large-8 small-9 columns"> 
 
       <input type="text" placeholder="Find Stuff"> 
 
       </div> 
 
       <div class="large-4 small-3 columns"> 
 
       <a href="#" class="alert button expand">Search</a> 
 
       </div> 
 
      </div> 
 
      </li> 
 
     </ul> 
 

 
     <!-- Left Nav Section --> 
 
     <ul class="left"> 
 
      <li class="has-dropdown"> 
 
      <a href="#">Left Button Dropdown</a> 
 
      <ul class="dropdown"> 
 
       <li><a href="#">First link in dropdown</a> 
 
       </li> 
 
       <li class="active"><a href="#">Active link in dropdown</a> 
 
       </li> 
 
      </ul> 
 
      </li> 
 

 
     </ul> 
 
     </section> 
 
    </nav> 
 
    </div> 
 
    <!---main content goes here--> 
 
    <div class="single-items"> 
 
    <div> 
 
     <img src="http://wallpapercartoon.com/wp-content/uploads/2014/07/o-DOUG-facebook.jpg"> 
 
    </div> 
 

 
    <div> 
 
     <img src="http://img3.wikia.nocookie.net/__cb20130803215442/nickelodeon/images/e/e2/Tumblr_lvjvhxwDiM1r6hffko1_400.jpg"> 
 
    </div> 
 

 
    <div> 
 
     <img src="http://fc02.deviantart.net/fs70/f/2013/303/b/4/pork_chop_by_barontremaynecaple-d6sdm6s.jpg"> 
 
    </div> 
 
    </div> 
 

 

 
    <script type="text/javascript" src="//cdn.jsdelivr.net/jquery.slick/1.3.15/slick.min.js"></script> 
 
    <script src="js/vendor/jquery.js"></script> 
 
    <script src="js/foundation.min.js"></script> 
 

 

 
    <script> 
 
    $(document).foundation(); 
 
    </script> 
 

 
</html>

+0

Не могли бы вы выслать некоторый код вместе со своей ссылкой jsbin? Спасибо. – soktinpk

+1

исправлено, дайте мне знать, если что-нибудь еще, что я могу добавить, что поможет. Впервые я задавал здесь вопрос. –

+0

Спасибо. Я не понимаю, почему, хотя это не сработает. Вы загружали jquery перед загрузкой скрипта? – soktinpk

ответ

1

Просто добавьте HTTP или HTTPS к вашему jquery.slick script ссылки.

<script type="text/javascript" src="http://cdn.jsdelivr.net/jquery.slick/1.3.15/slick.min.js"></script> 

Вы, вероятно, иметь статический веб-сайт в вашем рабочем столе (без веб-сервера), так что браузер не знает, как решить эту ссылку без HTTP или HTTPS. Поскольку JSBin, как и любой размещенный веб-сайт, работает на веб-сервере, браузер знает, как разрешить ссылку. Он добавляет http или https, принимая значение URL-адреса сайта.

* Сделайте то же самое для своего link css reference.

+0

ну, я думаю, я должен обновить У меня был исправлен мой проблема sorta смысл я сдался на гладкой карусели и пошел с совой карусели, которая работает отлично. спасибо всем за помощь !!! –

+0

@CodyCarmichael пожалуйста, если он работает, не стесняйтесь принять ответ. – ianaya89

-1

Попробуйте удалить двойной экземпляр jquery ('vendor/jquery.js' и 'jquery-1.11.1.min.js'). Насколько мне известно, slick.js получил проблемы с более старые версии jquery.

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