在这种情况下，为什么要添加两个指向JQuery的链接 [英] Why to add two links to JQuery in this case
问题描述
我在Javascript和JQuery方面的经验为零，但在本文档中我都使用过.
I have zero experience in Javascript and JQuery but I have used both in this document.
The first one is to give support to IE for CSS3 transitions and is taken from CSS3 Hover Transition. The code used is
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.js"></script>
<script type="text/javascript" src="scripts/jquery.hoverTransition.js"></script>
第二个是幻灯片库，取自幻灯片库，代码为
The seond one is for a slideshow gallery and is taken from slideshow gallery and the code is
<script type="text/javascript" src="scripts/jquery-1.3.2.js"></script>
<script type="text/javascript" src="scripts/jquery.galleriffic.js"></script>
<script type="text/javascript" src="scripts/jquery.opacityrollover.js"></script>
可以看出，以前的CSS3 Transitions链接到jquery 1.6.1，而后面的幻灯片库链接到jquery 1.3.2.我必须同时引用这两个文件吗?
As can be seen the former CSS3 Transitions links to jquery 1.6.1 while the later slideshow gallery links to jquery 1.3.2. Do I have to refer to both these files?
我尝试删除一个链接，也删除了另一个链接，但是如果删除了任何一个链接，CSS3 Hover Transitions和Slideshow Glaeery都不会起作用.阿洛斯，如果我将以上内容放在我的头部中，它们将不起作用.仅当我在页脚之后和body元素之前将它们放在底部时，它们才起作用.
I tried removing one link and the other as well but if either of the link is removed, neither the CSS3 Hover Transitions work nor the Slideshow Glaeery work. Alos if I place the above in my head element, they dont work. They only work If I have them at the bottom after the footer and before the body element.
以下是我的头部标签. (用于幻灯片库)
The following is in my head tag. (for the Slideshow Gallery)
<!-- We only want the thunbnails to display when javascript is disabled -->
<script type="text/javascript">
document.write('<style>.noscript { display: none; }</style>');
</script>
以下是底部. (用于幻灯片库)
And the following is at the bottom. (for the Slideshow Gallery)
<script type="text/javascript">
jQuery(document).ready(function($) {
// We only want these styles applied when javascript is enabled
$('div.navigation').css({'width' : '300px', 'float' : 'left'});
$('div.content').css('display', 'block');
// Initially set opacity on thumbs and add
// additional styling for hover effect on thumbs
var onMouseOutOpacity = 0.67;
$('#thumbs ul.thumbs li').opacityrollover({
mouseOutOpacity: onMouseOutOpacity,
mouseOverOpacity: 1.0,
fadeSpeed: 'fast',
exemptionSelector: '.selected'
});
// Initialize Advanced Galleriffic Gallery
var gallery = $('#thumbs').galleriffic({
delay: 5500,
numThumbs: 15,
preloadAhead: 10,
enableTopPager: true,
enableBottomPager: true,
maxPagesToShow: 7,
imageContainerSel: '#slideshow',
controlsContainerSel: '#controls',
captionContainerSel: '#caption',
loadingContainerSel: '#loading',
renderSSControls: true,
renderNavControls: true,
playLinkText: 'Play',
pauseLinkText: 'Pause',
prevLinkText: 'Previous',
nextLinkText: 'Next',
nextPageLinkText: 'Next ›',
prevPageLinkText: '‹ Prev',
enableHistory: false,
autoStart: true,
syncTransitions: true,
defaultTransitionDuration: 900,
onSlideChange: function(prevIndex, nextIndex) {
// 'this' refers to the gallery, which is an extension of $('#thumbs')
this.find('ul.thumbs').children()
.eq(prevIndex).fadeTo('fast', onMouseOutOpacity).end()
.eq(nextIndex).fadeTo('fast', 1.0);
},
onPageTransitionOut: function(callback) {
this.fadeTo('fast', 0.0, callback);
},
onPageTransitionIn: function() {
this.fadeTo('fast', 1.0);
}
});
});
</script>
推荐答案
在同一个页面中放置两个不同版本的jQuery既复杂又不理想.您的首要目标是完全避免这种情况-您只希望页面中包含较新版本的jQuery.
It is complicated and undesirable to put two different versions of jQuery in the same page. Your first goal is to avoid this entirely - you'd rather only have the newer version of jQuery in the page.
因此，您的首要任务是对正在使用的jQuery插件进行一些研究，看看它们是否都可以与jQuery的通用版本一起使用.
So, your first order of business is to do some research on the jQuery plug-ins you're using and see if they will all work with a common version of jQuery.
如果确定它们都可以使用通用版本的jQuery，则只需在页面中将jQuery插入插件之前，并在使用它们的代码之前插入插件即可. jQuery代码可以放在HEAD部分或BODY部分中，只要它在尝试使用它的任何内容之前即可.插件代码可能会在jQuery代码之后出现，但是您必须查阅插件文档来确定.
If you determine that they will all work with a common version of jQuery, then just include jQuery in your page before the plugins and include the plugins before your code that uses them. The jQuery code can go in the HEAD section or in the BODY section as long as it's before anything that tries to use it. The plug-in code can probably go anywhere after the jQuery code, but you'd have to consult the plug-in doc to make sure.
如果您确定必须拥有两个不同版本的jQuery，则需要弄清楚如何做到这一点.以下是有关此操作的相关问题:我可以在同一页面上使用多个版本的jQuery吗?.
If you determine that you have to have two different versions of jQuery, then you need to work out how you go about doing that. Here's a related question on how that is done: Can I use multiple versions of jQuery on the same page?.
使用两个版本的jQuery时，最终必须定义一个唯一的符号，该符号表示使用jQuery.noConflict()(不是jQuery和$)的jQuery的特定版本，然后是使用该插件的所有代码-必须使用该唯一符号.
When using two versions of jQuery, you end up having to define a unique symbol that represents a particular version of jQuery using jQuery.noConflict() (not jQuery and not $) and then ALL code that uses that plug-in has to use that unique symbol.
这篇关于在这种情况下，为什么要添加两个指向JQuery的链接的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
