当我加载prototype.js时,我的javascript失败了,如何修复它?
我正在尝试为朋友的夏季购物车系统进行新设计。系统通常有出现/消失的子类别菜单,但后来我下载了一个名为“lightbox”的javascript插件,它在保留页面的同时在当前窗口中显示图像,而不是打开一个新窗口来显示图像。现在的问题是这个“lightbox”插件有一个名为“prototype.js”的文件,这会导致子类别无法工作...
Prototype.js: http://www.mediafire.com/?sj3xzdw2gchmca0
使子菜单出现/消失的代码:
$(function () {
var stepOver = 20; // The number of pixels of the upper box that are going to cover its parent.
$("#DropdownCategories ul li").hover(
function () {
var firstUls = $(this).find('ul:first');
firstUls.show();
var positionLeft = $(this).position().left - stepOver + $(this).outerWidth();
var offsetLeft = $(this).offset().left - stepOver + $(this).outerWidth();
// Find the position that the box is going to end in.
var wouldEnd = offsetLeft + firstUls.outerWidth();
// If the box ends out of the body we move the box on the left side.
if (wouldEnd > $('body').innerWidth()) {
positionLeft = $(this).position().left - firstUls.outerWidth() + stepOver;
}
firstUls.css('position', 'absolute')
.css('top', $(this).position().top + 'px')
.css('left', positionLeft + 'px');
},
function () {
$(this).find('ul:first').hide();
}
);
});
实际网站:http://www.sladurko.com/product/277/bluza -kas-rakav.html
I'm trying to make a new design for a friend's Summer Cart system. The system usually has appearing/disappearing subcategory menus, but then I downloaded a javascript plugin called "lightbox" that shows an image in the current window while it keeps the page, instead of opening up a new window where to show the image. Now the problem is that this "lightbox" plugin has a file called "prototype.js" which causes the subcategories not to work...
Prototype.js: http://www.mediafire.com/?sj3xzdw2gchmca0
The code that makes the submenus appear/disappear:
$(function () {
var stepOver = 20; // The number of pixels of the upper box that are going to cover its parent.
$("#DropdownCategories ul li").hover(
function () {
var firstUls = $(this).find('ul:first');
firstUls.show();
var positionLeft = $(this).position().left - stepOver + $(this).outerWidth();
var offsetLeft = $(this).offset().left - stepOver + $(this).outerWidth();
// Find the position that the box is going to end in.
var wouldEnd = offsetLeft + firstUls.outerWidth();
// If the box ends out of the body we move the box on the left side.
if (wouldEnd > $('body').innerWidth()) {
positionLeft = $(this).position().left - firstUls.outerWidth() + stepOver;
}
firstUls.css('position', 'absolute')
.css('top', $(this).position().top + 'px')
.css('left', positionLeft + 'px');
},
function () {
$(this).find('ul:first').hide();
}
);
});
The actual website: http://www.sladurko.com/product/277/bluza-kas-rakav.html
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
您使用的是 jQuery,因此您需要使用
noConflict
you're using jQuery, so you'll need to use
noConflict
既然您已经使用了 jQuery,那么请选择 jQuery 兼容的 lightbox 插件。添加像 Prototype 这样的完整独立库对于一个简单的任务来说是过度的,所以避免它。如果您已经在使用 Prototype,那么出于同样的原因,我建议您避免添加 jQuery。
Since you already use jQuery then choose a jQuery compatible lightbox plugin instead. Adding a whole separate library like Prototype is overkill for a simple task so avoid it. If you were already using Prototype then I would suggest avoid adding jQuery for the same reasons.