Question

我有一个缩放插件需要旧版本的jquery，并且在主要时间我使用的是Twitter Bootstrap，它需要更新版本的jquery库，但Twitter Bootstrap正在工作，但缩放插件无法正常工作 - 低于js顺序

 <!-- The JavaScript -->
<script src="js/jquery-1.6.js" type="text/javascript"></script>
<script src="js/jquery-1.10.2.min.js"></script>
<script src="js/jquery.jqzoom-core.js" type="text/javascript"></script>
<script src="js/bootstrap.js"></script>
<script type="text/javascript">

</script>

<script type="text/javascript">

var bt = jQuery.noConflict(true);

bt(function() {
 bt('#myTab a').click(function (e) {
        e.preventDefault();
        bt(this).tab('show');
    });
});

</script>



<script type="text/javascript">

var zoom_1_6 = $.noConflict(true);

   zoom_1_6(function() {

    zoom_1_6('.jqzoom').jqzoom({
        zoomType: 'standard',
        lens:true,
        preloadImages: false,
        alwaysOn:false
    });

});

</script>

Answer 1

你过度复杂了。

<!-- primary first --->
<script src="js/jquery-1.10.2.min.js"></script>
<script src="js/bootstrap.js"></script>
<!-- secondary second --->
<script src="js/jquery-1.6.js" type="text/javascript"></script>
<script src="js/jquery.jqzoom-core.js" type="text/javascript"></script>
<script>

$(function() {

    $('.jqzoom').jqzoom({
        zoomType: 'standard',
        lens:true,
        preloadImages: false,
        alwaysOn:false
    });

    // revert ownership of $ and jQuery to 1.10.2
    $.noConflict(true);    

    $('#myTab a').click(function (e) {
        e.preventDefault();
        $(this).tab('show');
    });

});

</script>

脚本包含的顺序非常重要。包括1.10.2之后立即需要1.10.2的脚本，以及1.6之后立即需要1.6的脚本。

Answer 2

如果您不关心IE7及更早版本（我没有）只需删除以下行，如果在“jquery.jqzoom-core.js”中有关于explorer 7或更早版本的状态，请删除

23

var isIE6 = ($.browser.msie && $.browser.version < 7);

460

if ($.browser.msie && $.browser.version > 7) {
                $(this.node).empty().append(this.image);
            }

598

 if (isIE6 && settings.zoomType != 'innerzoom') {
                    this.ieframe.width = this.node.width();
                    this.ieframe.height = this.node.height();
                    this.ieframe.left = this.node.leftpos;
                    this.ieframe.top = this.node.toppos;
                    this.ieframe.css({
                        display: 'block',
                        position: "absolute",
                        left: this.ieframe.left,
                        top: this.ieframe.top,
                        zIndex: 99,
                        width: this.ieframe.width + 'px',
                        height: this.ieframe.height + 'px'
                    });
                    $('.zoomPad', el).append(this.ieframe);
                    this.ieframe.show();
                };

zoom plugin需要较旧版本的jquery，但它与twitter bootstrap冲突

2 个答案: