Код Jquery работает на JsFiddle, но больше не на моем компьютере - PullRequest
Новая
       35

Код Jquery работает на JsFiddle, но больше не на моем компьютере

1 голос
/ 31 января 2012

У меня есть небольшая проблема, и я устал пытаться ее решить. Код JQuery замедления отлично работает на jsfiddle, но больше не работает на моем тестовом сервере на локальном хосте. Когда я удаляю эффект jQuery, все возвращается на круги своя, и код работает нормально ...

Мне интересно, что-то не так с кодом? Это что-то связанное с функцией OnLoad или что-то ... !! 

<head>
<script src="http://gsgd.co.uk/sandbox/jquery/easing/jquery.easing.1.3.js" type="text/javascript" ></script>
<script src="http://code.jquery.com/jquery-1.7.1.min.js" type="text/javascript"></script>
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript">
  jQuery(function($) {
    $('.topnav li').find('a[href]').parent().each(function() {
        var li = $(this),
        a = li.find('a'),
        div = $('<div>' + '<\/div>');

        li.hover(function() {
           a.stop().animate({marginTop: '-64'}, 600, "easeOutBack");
        },
        function() {
           a.stop().animate({marginTop: '0'}, 500, "easeOutBack");
        })
       .append(div);
   });
});

Вот код JSFiddle .

Ответы [ 3 ]

2 голосов
/ 31 января 2012

Попробуйте, ваша последовательность включения javascript была неверной. 

<head>
 <script src="http://code.jquery.com/jquery-1.7.1.min.js" type="text/javascript"></script>
 <script src="http://gsgd.co.uk/sandbox/jquery/easing/jquery.easing.1.3.js" type="text/javascript" ></script>
 <script src="http://www.google.com/jsapi" type="text/javascript"></script>
 <script type="text/javascript">
   $(document).ready(function(){
      $('.topnav li').find('a[href]').parent().each(function() {
        var li = $(this),
        a = li.find('a'),
        div = $('<div>' + '<\/div>');

        li.hover(function() {
        a.stop().animate({marginTop: '-64'}, 600, "easeOutBack");
      },
      function() {
        a.stop().animate({marginTop: '0'}, 500, "easeOutBack");
      })
      .append(div);
    });
  });
 </script>
</head>

Я провел локальное тестирование (см. Снимок экрана)

enter image description here

Надеюсьэто работает для вас.

1 голос
/ 31 января 2012

Надеюсь, это поможет:

Вместо использования jquery file.js вы можете использовать Google для этого, а также jquery-ui, если это необходимо. Это более динамично, и вы можете изменить используемую версию. 

    <script src="http://www.google.com/jsapi" type="text/javascript"></script>
    <script type="text/javascript">
        google.load("jquery", "1.7.1");
        //google.load("jqueryui", "1.7.3");
    </script>

После этого поместите свой js с функциями jquery (код, который вы получили в jsFiddle): 

<script src="scripts/functions.js" type="text/javascript"></script>

И это должно сработать.

1 голос
/ 31 января 2012

Извините, я пока не могу комментировать, поэтому ...

Посмотри, что сказала Янаси.

Посмотрите, не включили ли вы тег jquery script после вашего тега script. Ваш скрипт должен быть загружен после зависимостей, например: 

<script src="jquery.js> </script>
<script src="yours.js"> </script>
...