求指点方法,幻灯片.

Question

给一个示例LZ参考：http://www.ido321.com/862.html

Answer 1

   $(".slide_left").click(function(){
var left_px = $(this).css("left") || "0";
var left = parseInt(left_px.replace("px", ""));//这个时候可以获得当前left, 只需要减去位移就可以了// 同理 是否到达顶端也能在此判断
            $("#flight_slide ul").stop(false,true).animate({"left": left-flight_slide_width},300);                           
        })

Answer 2

还是不懂超出总和的情况下如何控制.望指点$(".slide_left").click(function(){
var move_px = parseInt($("#flight_slide ul").css("left")) || "0";
$("#flight_slide ul").stop(false,true).animate({"left":move_px + flight_slide_width},300);
})
$(".slide_right").click(function(){
var move_px = parseInt($("#flight_slide ul").css("left")) || "0";
$("#flight_slide ul").stop(false,true).animate({"left":move_px - flight_slide_width},300);
})

Answer 3

var slide_sum = flight_slide_length * flight_slide_width;
$(".slide_left").click(function(){
var move_px = parseInt($("#flight_slide ul").css("left")) || "0";
$("#flight_slide ul").stop(false,true).animate({"left":move_px + flight_slide_width},300);

})
$(".slide_right").click(function(){
var move_px = parseInt($("#flight_slide ul").css("left")) || "0";
$("#flight_slide ul").stop(false,true).animate({"left":move_px - flight_slide_width},300);
if(move_px ==  -slide_sum) {move_px = 0;}
})
自己顶下,求指点.

Answer 4

解决了.恕我愚钝,没有什么好办法.用的加减...
//新增左右按钮
var slide_sum = parseInt(flight_slide_length * -flight_slide_width);
$(".slide_left").click(function(){
var move_px = parseInt($("#flight_slide ul").css("left")) || "0";
$("#flight_slide ul").stop(false,true).animate({"left":move_px + flight_slide_width},300);
var move_box1 = slide_sum + flight_slide_width;
if(move_px >= 0) {$("#flight_slide ul").stop(false,true).animate({"left":move_box1},300);}
})
$(".slide_right").click(function(){
var move_px = parseInt($("#flight_slide ul").css("left")) || "0";
$("#flight_slide ul").stop(false,true).animate({"left":move_px - flight_slide_width},300);
var move_box = move_px - flight_slide_width;
if(slide_sum >= move_box) {$("#flight_slide ul").stop(false,true).animate({"left":0},300);}
})

Answer 5

网络上有很多幻灯片插件可以参看或者直接使用，比如：http://www.ui3g.com/tag/%E5%B9%BB%E7%81%AF%E7%89%87/

Answer 6

swiper插件
http://www.idangero.us/sliders/swiper/index.php    插件主页
http://www.idangero.us/sliders/swiper/api.php        插件API
http://www.idangero.us/sliders/swiper/demos.php   插件DEMO
https://github.com/nolimits4web/Swiper/tree/master/src　　下载
仔细看看API，就知道它多么强大了

Answer 7

function flightSlide (n)
    {   
        flight_slide_index = flight_slide_index>flight_slide_length?0:flight_slide_index;
        $("#flight_slide ul").stop(false,true).animate({"left":-n*flight_slide_width},300);
    }
$(".slide_left").click(function(){
          flightSlide(flight_slide_index-1);                   
        })$(".slide_right").click(function(){
            flightSlide(flight_slide_index+1);     
        })只要一个核心方法来显示 就可以了flightSlide