Hanya satu halaman berfungsi dengan baik, tetapi terdapat masalah apabila dua diletakkan pada satu halaman Bagaimana saya boleh mengubah suainya?
Panggil $(fungsi ()
{
var opt1 = {
"speed": "slow", //变换速度,三速度可选 slow,normal,fast;
"by": "mouseover", //触发事件,click或者mouseover;
"auto": true, //是否自动播放;
"sec": 1000 //自动播放间隔;
};
$("#mp_gnq").demo(opt1);
});(fungsi ($)
{
$.fn.extend({
demo: function (opt)
{
var opt = arguments[0] ? arguments[0] : false;
var $button = $(this).children("li"); //容器;
var $sec = 3000; //自动播放默认时间;
var $min = $button.last().width(); //最小宽度;
var $max = $button.first().width(); //最大宽度;
var $index = 1; //轮播开始索引号;
$default = {
speed:opt.speed?opt.speed:"slow",
by: opt.by ? opt.by : "mouseover",
auto: opt.auto ? opt.auto : false,
sec: opt.sec ? opt.sec < 1000 ? 1000 : opt.sec : $sec,
maxWidth: $max,
minWidth: $min,
index: $index
};
$button.bind($default.by, this.run).autoPlay();
},
run: function ()
{ //运行方法;
var $obj = $(this);
if ($obj.width() == $default.minWidth)
{
var timeDo = window.setTimeout(function ()
{
$default.index = $obj.index();
$obj.anim();
}, 100);
$obj.mouseout(function ()
{
window.clearTimeout(timeDo);
});
}
},
autoPlay: function () { //自动播放;
if ($default.auto) {
var $this = $(this);
$this.autoDo();
$this.mouseover(function () {
window.clearInterval(timeL);
});
$this.mouseout(function () {
$this.autoDo();
});
}
},
autoDo: function () { //播放方法;
var $len = $(this).length - 1;
var $this = $(this);
timeL = window.setInterval(function () {
$this.eq($default.index).anim();
$default.index < $len ? $default.index++ : $default.index = 0;
}, $default.sec);
},
anim: function ()
{ //动画方法;
var $fx = function ()
{
$(this).siblings("li").animate({
width: $default.minWidth}, $default.speed);
$(this).animate({
width: $default.maxWidth}, $default.speed);
$(this).dequeue();
};
$(this).queue($fx);
}
});
})(jQuery);
<ul id="mp_gnq">
<li>
<a href="#"><img src="../image/a1.jpg" width="740" height="319" class="bor0" /></a>
<p class="mp_p"></p>
<span class="mp_a">三亚</span>
<p class="mp_yi"></p>
</li>
<li>
<a href="#"><img src="../image/a2.jpg" width="740" height="319" class="bor0" /></a>
<p class="mp_p"></p>
<span class="mp_a">杭州</span>
<p class="mp_yi"></p>
</li>
<li>
<a href="#"><img src="../image/a3.jpg" width="740" height="319" class="bor0" /></a>
<p class="mp_p"></p>
<span class="mp_a">厦门</span>
<p class="mp_yi"></p>
</li>
<li>
<a href="#"><img src="../image/a4.jpg" width="740" height="319" class="bor0" /></a>
<p class="mp_p"></p>
<span class="mp_a">杭州</span>
<p class="mp_yi"></p>
</li>
<li>
<a href="#"><img src="../image/a5.jpg" width="740" height="319" class="bor0" /></a>
<p class="mp_p"></p>
<span class="mp_a">厦门</span>
<p class="mp_yi"></p>
</li>
</ul>
Saya tidak faham apa yang anda ingin nyatakan dalam huraian, tetapi jika anda maksudkan bahawa jika anda memperkenalkan satu jQuery.js, pemalam anda akan dijalankan, tetapi jika anda memperkenalkan dua, ia tidak akan berfungsi. Anda boleh lihat ini
http://blogread.cn/it/article...
Tajuk dan penerangan anda tidak konsisten
Cuba $.noConflict()? ?
Kedua-dua pemalam beroperasi pada dom yang sama yang anda mahu dom ini dengari?
Jangan gunakan terlalu banyak pemalam, ubah suainya dengan sewajarnya, jika tidak, anda tidak akan dapat memberitahu apa-apa tanpa melihat gambar sebenar