我正在设计这个网站，我尝试使用 mootools 1.31 在单击或鼠标悬停在其周围时对某些 div 框进行动画处理，以显示内容。问题是，它似乎在网页上不起作用，但如果我在空白网页上尝试相同的脚本，它会起作用，我想可能是因为我在同一页面上有 Jquery 1.52，也许两个脚本都相互冲突其他原因是，如果我删除 Jquery，Mootools 就可以工作。我应该选择什么，因为我需要 Jquery 为我做一些验证，所以我不能完全删除它。
这是代码
<script>
//-vertical
var mySlide = new Fx.Slide('test');
$('slidein').addEvent('click', function(e){
e = new Event(e);
mySlide.slideIn();
e.stop();
});
$('slideout').addEvent('click', function(e){
e = new Event(e);
mySlide.slideOut();
e.stop();
});
$('toggle').addEvent('click', function(e){
e = new Event(e);
mySlide.toggle();
e.stop();
});
$('hide').addEvent('click', function(e){
e = new Event(e);
mySlide.hide();
e.stop();
});
</script>
这是 HTML
<html>
<h3 class="section">Fx.Slide Vertical</h3>
<a id="slideout" href="#">slideout</a> |
<a id="slidein" href="#">slidein</a> | <a id="toggle" href="#">
toggle</a> | <a id="hide" href="#">hide</a>
<div id="test">
Lorem ipsum dolor sit amet, consectetur adipisicing elit,
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad mi
nim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip
ex ea commodo consequat. Duis aute irure dolor in reprehenderit in
voluptate velit esse cillum dolore eu fugiat nulla pariatur.
Excepteur sint occaecat cupidatat non proident, sunt in culpa
qui officia deserunt mollit anim id est laborum.
</div>
这是 CSS
#test {
background: #222;
color: #fff;
padding: 10px;
margin: 20px;
border: 10px solid pink;
}
#test2 {
background: #222;
color: #fff;
padding: 10px;
margin: 20px;
border: 10px solid pink;
}
我在自己的示例中使用 Mootools 提供的完全相同的代码，如果我在空白网页上执行此操作，它可以工作，但合并到我自己的网页中，则不行，而且我自己的页面只有HTML 的 head 部分中的 Jquery。
最佳答案
$ 函数/对象存在于两个库(MooTools 和 jQuery)中。如果您想同时使用它们，则必须使用库名称来使用其中之一:例如jQuery('slideout').addEvent(... 而不是 $('slideout').addEvent(...
有用的链接:
关于jquery - 如果Jquery和Mootools都用在网页上，通常会发生冲突吗？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/8227277/