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