单独在一个页面里面就好使 放两个在一个页面切换就有问题 请问怎么修改呢
调用
$(function ()
{
var opt1 = {
"speed": "slow", //变换速度,三速度可选 slow,normal,fast;
"by": "mouseover", //触发事件,click或者mouseover;
"auto": true, //是否自动播放;
"sec": 1000 //自动播放间隔;
};
$("#mp_gnq").demo(opt1);
});
(function ($)
{
$.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>
描述中看不懂想表达什么，但是如果你是说，引入一个jQuery.js那你插件能运行，引入两个就不行的话。你可以看看这个
http://blogread.cn/it/article...
你的标题与表述前后矛盾哦
试试$.noConflict() ？？
两个插件都操作在一个dom上，你让这个dom听谁的？
插件不要套太多，适当修改吧，另你这个不看实际的图是看不出来啥的