Решение проблемы Jquery и Mootools | uCoz
   

Решение проблемы Jquery и Mootools

Главная » Уроки » Создание сайтов

В этой статье мы будем описывать способы «подружить» два различных движка для реализации широкого круга функций в веб-дизайне – это MooTools и jQuery. По своей сути это не одно и то же, но некоторый функционал сайта, как слайдшоу и прочие украшения, могут исполняться обоими средствами.

Решение проблемы Jquery и Mootools

Однако часто приходится сталкиваться с неприятным моментом – установив на одной странице, к примеру, слайдшоу на jQuery и там же анимированное меню, либо лайтбокс, использующий фреймворк MooTools – одна из этих функций перестанет работать.

Выхода может быть два – искать необходимые функции на одном движке, либо найти способ устранить конфликт между разнородными библиотеками. Для этого предусмотрительные разработчики jQuery внедрили замечательную функцию – jQuery.noConflict();. Именно её мы сейчас рассмотрим.

Корень проблемы лежит в противоречии с наличием символа $, который используется для вызова функции, и наличие этого символа в других участках кода, создает для движка неразрешимую задачу, что приводит к его неработоспособности. Мы для решения этой задачи переопределим вызов $-функции.

Код:

<html>
<head>
<script src="mootools.js"></script>
<script src="jquery.js"></script>
<script>
jQuery.noConflict();

// Вызов через jQuery(...)
jQuery(document).ready(function(){
jQuery("div").hide();
})

// Для Mootools оставляем $(...)
$('someid').hide();
</script>
</head>
<body>
...
</body>
</html>

Мы можем немного сократить код следующим образом – но по сути разницы не будет:

Код:

<html>
<head>
<script src="mootools.js"></script>
<script src="jquery.js"></script>
<script>
var $j = jQuery.noConflict();
// Вызов через $j(...)
$j(document).ready(function(){
$j("div").hide();
});
// Для Mootools оставляем $(...)
$('someid').hide();
</script>
</head>
<body>
...
</body>
</html>

Альтернативные названия Вы можете определять сами по своему желанию (к примеру, jq, $j).

Также можно воспользоваться вариантом, не обуславливающим процедуры с переопределением:

Код:

<html>
<head>
<script src="mootools.js"></script>
<script src="jquery.js"></script>
<script>
jQuery.noConflict();
jQuery(document).ready(function($){
$("div").hide();
});
// Для Mootools $(...)
$('someid').hide();
</script>
</head>
<body></body>
</html>

Пользоваться можете любым вариантом, результат все дают внешне одинаковый.

При использовании CMS Joomla, вам достаточно включить плагин «Система – Обновление Mootools».

Предлагаю вам воспользоваться полезной программой для веб-мастеров, SEO-шников и копирайтеров — SEOTextEd v. 1.1. Это строковый редактор, который позволяет считать количество знаков в тексте, слов, строк, убирать двойные пробелы и многое другое.

Категория: Создание сайтов; Урок сделан: 07.04.2012; Просмотров : 923; Рейтинг : 0.0/0;
Всего комментариев: 0
Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]

Задать вопрос

Вы можете задать свой вопрос, соответствующий тематике сайта.

Задумался?

Задать свой вопрос

Вход


Здравствуйте, Гость!


Copyright © 2010-2016 Pro100uCoz.ru