0

ページで colorbox プラグインと mscarousel を使用しました。javascript スクリプト ファイルをサポートする colorbox と mscarousel の両方が互いに競合しています。カラーボックス サポート スクリプト ファイルを削除すると、ms カルーセルが機能し、ms カルーセル サポート ファイルを削除すると、カラーボックス プラグインが機能します。しかし、両方のプラグインが機能する必要があります。このjqueryの競合を修正するには?

Colorbox プラグイン head タグ内のサポート ファイル

<script src="jquery-1.4.1.min.js" type="text/javascript"></scrip>
<link href="admin/colorbox.css" rel="stylesheet" type="text/css" />
<script src="admin/jquery.colorbox-min.js" type="text/javascript"></script>
<script type="text/javascript">
        $(document).ready(function(){
            $(".popup").colorbox({width:"540px", height:"405px", iframe:true});
        });

</script>

head タグ内の MS Carousel Support Files

<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="js/jquery.msCarousel-min.js"></script>
<link rel="stylesheet" type="text/css" href="css/mscarousel.css" />
<style type="text/css">
.mstoplinks{padding:3px; border-bottom:2px solid #c3c3c3;}
.mstoplinks a, .mstoplinks a:visited{color:#003366; text-decoration:none; border-right:1px solid #c3c3c3; padding:0 10px}
.mstoplinks a.active, .mstoplinks a.active:visited{color:#003366; text-decoration:none; border-right:1px solid #c3c3c3; padding:0 10px;border-bottom:1px solid #c3c3c3; border-left:1px solid #c3c3c3; }
.version{font-size:12px; color:#EE3C95;}
</style>

body タグ内の MS-carousel スクリプト

<script type="text/javascript">
$(document).ready(function() {  
try {
    var oHandlerHorizontal = $("#carouseldiv").msCarousel({boxClass:'div.set', width:110, height:122, scrollSpeed:500}).data("msCarousel");
    $("#next").click(function() {
        oHandlerHorizontal.next();
    });
    $("#previous").click(function() {
        oHandlerHorizontal.previous();
    }); 
    //vertical
    var oHandlerVertical = $("#verticalCarousel").msCarousel({boxClass:'div.set', width:486, height:198, scrollSpeed:500, vertical:true}).data("msCarousel");
    $("#nextV").click(function() {
        oHandlerVertical.next();
    });
    $("#previousV").click(function() {
        oHandlerVertical.previous();
    });
    //no use
    $("#ver").html("v"+oHandlerHorizontal.getVersion());

} catch(e) {
    alert(e.message);
}

})
</script>
4

1 に答える 1

0

これらすべてのコードが単一のファイルにある場合は、削除するだけです

<script src="jquery-1.4.1.min.js" type="text/javascript"></scrip>

そして、置きます

<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
于 2012-09-27T06:32:19.643 に答える