Форум программистов, компьютерный форум, киберфорум
Наши страницы
JavaScript
Войти
Регистрация
Восстановить пароль
 
Рейтинг 4.63/8: Рейтинг темы: голосов - 8, средняя оценка - 4.63
progressive
0 / 0 / 0
Регистрация: 26.03.2010
Сообщений: 10
#1

Использоване 2 эффектов на jquery

01.06.2010, 21:30. Просмотров 1472. Ответов 4
Метки нет (Все метки)

Здраствуйте. При верстке сайта я столкнулся с такой проблемой. В шапке используется 2 эффекта на jqury: сам банер анимирован и меню с эффектом подсветки.
По отдельности (меню отдельно от банера) все отлично работает. А вот вместе не хотят.
Пример правильной работы меню: http://www.promosite-design.ru/work/wow/index.html
Пример правильной работы банера: http://www.promosite-design.ru/work/wow/index2.html

Исходный код:
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Бесплатный русский сервер WoW.</title>
<link rel="stylesheet" href="style.css" type="text/css" media="screen" />
 
<script src="js/jquery-1.3.2.js" type="text/javascript"></script>
<script type="text/javascript" language="Javascript" src="js/jquery.jparallax.js"></script>
 
<script type="text/javascript">
 
jQuery(document).ready(function(){
 
    jQuery('#parallax').jparallax();
 
 $(function() {
        $('#gallery a').lightBox();
    });
});
 
</script>
 
<script type="text/javascript">
 
$(document).ready(function() {
 
    $("ul#menu li a").wrapInner("<span></span>");
    $("ul#menu li a span").css({"opacity" : 0});
 
    $("ul#menu li a").hover(function(){
    
        $(this).children("span").animate({"opacity" : 1}, 400);
    
    }, function(){
    
        $(this).children("span").animate({"opacity" : 0}, 400);
    
    });
    
});
</script>
 
<script src="jquery-1.2.2.pack.js" type="text/javascript"></script>
 
<!-- Let's do the animation -->
<script type="text/javascript">
    $(function() {
        // set opacity to nill on page load
        $("ul#menu span").css("opacity","0");
        // on mouse over
        $("ul#menu span").hover(function () {
            // animate opacity to full
            $(this).stop().animate({
                opacity: 1
            }, 'slow');
        },
        // on mouse out
        function () {
            // animate opacity to nill
            $(this).stop().animate({
                opacity: 0
            }, 'slow');
        });
    });
</script>
 
</head>
<body>
<div id="top">  
    <div id="head">
     <div id="parallax">
     <img src="img/head4.png" alt="" style="width:800px; height:555px;"/>
     <img src="img/head3.png" alt="" style="width:950px; height:555px;"/>
     <img src="img/head2.png" alt="" style="width:900px; height:555px;"/>
     <img src="img/head1.png" alt="" style="width:800px; height:555px;"/>
     </div>
<ul id="menu">
        <li><a href="#" class="home"><span></span></a></li>
        <li><a href="#" class="acc"><span></span></a></li>
        <li><a href="#" class="forum"><span></span></a></li>
        <li><a href="#" class="files"><span></span></a></li>
        <li><a href="#" class="top"><span></span></a></li>
        <li><a href="#" class="about"><span></span></a></li>
</ul>
    </div>
</div>
</body>
</html>
когда из этого кода удоляю строку 44
HTML5
1
<script src="jquery-1.2.2.pack.js" type="text/javascript"></script>
начинает работать банер.
Я понимаю что проблема в использовании одновременно разных версий jqury, но в Java мало разбираюсь. Знакомого программиста под рукой нет. Помогите пожалуйста решить проблему.
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
Similar
Эксперт
41792 / 34177 / 6122
Регистрация: 12.04.2006
Сообщений: 57,940
01.06.2010, 21:30
Ответы с готовыми решениями:

Скрипт эффектов для фотографий
гне моно найти скрипт который добавляет ефект на фотку например как есть на...

Применение трансформационных эффектов в рамках JavaScript
Здравствуйте! Мне дали тему курсовой, такую вот, а я даже представления не...

Css(transition/transform) подвисание эффектов
Не знаю как объяснить, но постараюсь максимально ясно. Есть рулетка (круг)....

Могут ли конфликтовать два файла jquery.1.10.1.min.js и jquery-1.8.3.min.js
Добрый всем день. На сайте joomla пытаюсь подключить файл jquery.1.10.1.min.js,...

Использоване компонентов
Всем привет посоветуйте плиз книги по С++ Builder 6 в каких написано как...

4
рони
35 / 35 / 6
Регистрация: 26.02.2010
Сообщений: 62
01.06.2010, 22:23 #2
попробуй так
Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<script src="js/jquery-1.3.2.js" type="text/javascript"></script>
<script type="text/javascript" language="Javascript" src="js/jquery.jparallax.js"></script>
<script language="JavaScript" type="text/javascript">
<!--
jQuery(document).ready(function(){
$("ul#menu li a").wrapInner("<span></span>");
    $("ul#menu li a span").css({"opacity" : 0});
 
    $("ul#menu li a").hover(function(){
 
        $(this).children("span").animate({"opacity" : 1}, 400);
 
    }, function(){
 
        $(this).children("span").animate({"opacity" : 0}, 400);
 
    });
 // set opacity to nill on page load
        $("ul#menu span").css("opacity","0");
        // on mouse over
        $("ul#menu span").hover(function () {
            // animate opacity to full
            $(this).stop().animate({
                opacity: 1
            }, 'slow');
        },
        // on mouse out
        function () {
            // animate opacity to nill
            $(this).stop().animate({
                opacity: 0
            }, 'slow');
        });
 
  jQuery('#parallax').jparallax();
 
 $(function() {
        $('#gallery a').lightBox();
    });
 
});
//-->
</script>
все свои скрипты замени на это
0
etalord
работяга
366 / 366 / 52
Регистрация: 23.05.2010
Сообщений: 947
01.06.2010, 23:48 #3
чё-то я не заметил разницы между двумя ссылками: меню анимировано на обоих, а баннер нет

согласен с рони, на кой ляд подключать две библиотеки разных версий, они между собой точно конфликтовать будут. юзай наиболее новую версию
0
progressive
0 / 0 / 0
Регистрация: 26.03.2010
Сообщений: 10
02.06.2010, 00:31  [ТС] #4
Цитата Сообщение от varassa Посмотреть сообщение
чё-то я не заметил разницы между двумя ссылками: меню анимировано на обоих, а баннер нет
я в ссылках ошибся. Вот так правильно:
Пример правильной работы меню: http://www.promosite-design.ru/work/wow/index.html
Пример правильной работы банера: http://www.promosite-design.ru/work/wow/index2.html

P.S. Всем большое спасибо, советы помогли. Все заработало.
0
рони
35 / 35 / 6
Регистрация: 26.02.2010
Сообщений: 62
02.06.2010, 08:40 #5
ещё строки
Javascript
1
2
3
$(function() {
        $('#gallery a').lightBox();
    });
возможно лишние обьекта с таким id на страницах нет
0
02.06.2010, 08:40
MoreAnswers
Эксперт
37091 / 29110 / 5898
Регистрация: 17.06.2006
Сообщений: 43,301
02.06.2010, 08:40

Составление циклических алгоритмов.Использоване оператора цикла с параметром for.do
Задача: Вычислить квадраты всех чисел от n до m. Плиз напишите полное...

ToolStrip - отключение эффектов
Добрый день, товарищи. У меня есть форма, у которой шапка и края прорисованы...

Создание динамических эффектов
Помогите написать код: Нужно сделать динамический видеоэффект, желательно...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
5
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2018, vBulletin Solutions, Inc.
Рейтинг@Mail.ru