jQuery не работает на сайте

Тема в разделе "Интерактивные возможности", создана пользователем AlexChervon, 20.11.2015.

  1. AlexChervon
    Offline

    AlexChervon Пользователь

    Регистрация:
    14.11.2015
    Сообщения:
    57
    Симпатии:
    0
    Пол:
    Мужской
    в index.php есть див

    <div id="topmenu" class="test" data-effect="bounceIn" >
    <jdoc:include type="modules" name="topmenu" />
    </div>

    я создал класс (test) и data-effect="bounceIn" . У меня подключена библиотека animated.css
    Далее я захотел сделать так чтобы при наведении на пункт меню запускалась анимация. Я подключил библиотеку JQ проверил на работоспособность функцией alert. Далее в тегах head написал следующий скрипт

    <script>
    jq = jQuery.noConflict();
    function animate(elem) {
    var effect=elem.date("effect");
    elem.addClass("animated" +effect);

    }
    jq(document).ready(function(){
    jq("#test").mouseenter(function)(){
    animate(jq(this));
    });
    });

    </script>

    но при наведении на пунт меню ничего не происходит
     
  2.  
  3. CB9T
    Offline

    CB9T Преподаватель по J! Команда форума

    Регистрация:
    21.05.2010
    Сообщения:
    2 461
    Симпатии:
    303
    Пол:
    Мужской
    Анимацию можно и без Jquery делать, css анимация это как раз и делает.

    С Jquery лучше код внутри писать:

    Код (CODE):
    1. jQuery(document).ready(function($) {
    2.  $('.test').......... и прочее
    3.  
    4.  
    5.  });
     
  4. AlexChervon
    Offline

    AlexChervon Пользователь

    Регистрация:
    14.11.2015
    Сообщения:
    57
    Симпатии:
    0
    Пол:
    Мужской
    вот сделал

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
    <script>
    jQuery(document).ready(function($) {
    $('.test')function animate(elem){
    var effect = elem.data("effect");
    if(!effect || elem.hasClass(effect)) return false;
    elem.addClass(effect);
    setTimeout( function(){
    elem.removeClass(effect);
    }, 1000);
    }
    });

    </script>


    в дивах так
    <div class="test" id="topmenu" data-effect="bounceIn">
    <jdoc:include type="modules" name="topmenu" />
    </div>



    но ничего не работает((
     
  5. CB9T
    Offline

    CB9T Преподаватель по J! Команда форума

    Регистрация:
    21.05.2010
    Сообщения:
    2 461
    Симпатии:
    303
    Пол:
    Мужской
    Код (html):
    1. <div class="circleper"><a target="_blank" href="http://coupons.salonsuzana.ru/">%</a></div>



    Код (CODE):
    1. .circleper {
    2.     animation: percskidka 2s infinite linear;
    3.     -moz-animation: percskidka 2s infinite linear;
    4.     -webkit-animation: percskidka 2s infinite linear
    5. }


    Код (CODE):
    1. @keyframes percskidka {
    2.     from {
    3.         transform: rotate(0)
    4.     }
    5.  
    6.     to {
    7.         transform: rotate(360deg)
    8.     }
    9. }
    10.  
    11. @-moz-keyframes rotate {
    12.     from {
    13.         -moz-transform: rotate(0)
    14.     }
    15.  
    16.     to {
    17.         -moz-transform: rotatepercskidka(360deg)
    18.     }
    19. }
    20.  
    21. @-webkit-keyframes rotate {
    22.     from {
    23.         -webkit-transform: rotate(0)
    24.     }
    25.  
    26.     to {
    27.         -webkit-transform: rotate(360deg)
    28.     }
    29. }


    demo http://salonsuzana.ru/

    и не надо jquery
     
    AlexChervon нравится это.
  6. OlegM
    Offline

    OlegM Russian Joomla! Team Команда форума

    Регистрация:
    12.04.2007
    Сообщения:
    4 356
    Симпатии:
    370
    Пол:
    Мужской
    AlexChervon нравится это.

Поделиться этой страницей

Загрузка...