輪播實現(xiàn)方法

1、單個非無縫滾動輪播

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>27-1無限輪播</title>
    <style>
        ul,li{
            list-style: none;
        }
        *{
            margin: 0;
            padding: 0;
        }
        .ct-img>li{
            float: left;
            width: 310px;
            height: 210px;
            display: none;
        }
        li img{
            width: 310px;
            height: 210px;
        }

        .clearfix:after{
            content: "";
            display: block;
            clear: both;
        }
        .ct-bottom>li{
            border-bottom: 5px solid #555;
            float: left;
            cursor: pointer;
            width: 20px;
            margin: 0 5px;
            border-radius: 2px;
        }
        .ct-bottom{
            position: absolute;
            top: 180px;
            left: 95px;
        }
        body{
            position: relative;
        }
        a.change{
            text-decoration: none;
            font-size: larger;
            font-weight: 900;
            background-color: #666;
            color: #fff;
            display: inline-block;
            vertical-align: middle;
            padding: 15px;
            width: 10px;
            height: 10px;
            line-height: 10px;
            border-radius: 25px;
            opacity: 0.7;
        }
        a.pre{
            position: absolute;
            left: 10px;
            top: 80px;
        }
        a.next{
            position: absolute;
            left: 250px;
            top: 80px;
        }
        a.change:hover{
            background-color: #444;
        }

    </style>
</head>
<body>
    <div class="ct">
        <ul class="clearfix ct-img">
            <li data-nub="0"><a href="#">![](http://upload-images.jianshu.io/upload_images/2166980-fa29da09e1abe792.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)</a></li>
            <li data-nub="1"><a href="#">![](http://upload-images.jianshu.io/upload_images/2166980-0ed4f2fd9ea0b571.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)</a></li>
            <li data-nub="2"><a href="#">![](http://upload-images.jianshu.io/upload_images/2166980-e181309822223f13.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)</a></li>
            <li data-nub="3"><a href="#">![](http://upload-images.jianshu.io/upload_images/2166980-beeaa45457e1cc51.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)</a></li>
        </ul>
        <ul class="ct-bottom clearfix">
            <li></li>
            <li></li>
            <li></li>
            <li></li>
        </ul>
        <a href="####" class="pre change"> < </a>
        <a href="####" class="next change"> > </a>

    </div>
    <script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/1.9.1/jquery.min.js"></script>
    <script>

        var clock=false;
        show(0);
        setInterval(function () {
            playNext()
        },2000);


        function show(num) {
            if (clock){return;}
            clock=true;
            $(".ct-img").children().eq(num).siblings().css("display","none");
            $(".ct-bottom").children().eq(num).css("border-bottom-color","white");
            $(".ct-bottom").children().eq(num).siblings().css("border-bottom-color","#555");
            $(".ct-img").children().eq(num).fadeOut(500);
            $(".ct-img").children().eq(num).fadeIn(500,function () {
                clock=false
            });
             cur=num;
            return cur;
        }
        function playNext() {
            var nextNum=cur+1;
            if (nextNum===4){
                show(0)
            }
            else show(nextNum)
        }

        $(".next").on("click",function () {
            playNext();
        });

        $(".pre").on("click",function () {
            playPre();
        });

        function playPre() {
            var preNum=cur-1;
            if (preNum===-1){
                show(3)
            }
            else show(preNum)
        }
        $(".ct-bottom>li").on("click",function () {
            var $cur=$(this),
                indexNum=$cur.index();
                show(indexNum);
        })

    </script>

</body>
</html>

預(yù)覽地址：http://htmlpreview.github.io/?https://github.com/have-not-BUG/task/blob/master/renwu/renwu27/renwu27-1.html

2、多個個非無縫滾動輪播

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>27-1無限輪播</title>
    <style>
        ul,li{
            list-style: none;
        }
        *{
            margin: 0;
            padding: 0;
        }
        .ct-img>li{
            float: left;
            width: 310px;
            height: 210px;
            display: none;
        }
        li img{
            width: 310px;
            height: 210px;
        }

        .clearfix:after{
            content: "";
            display: block;
            clear: both;
        }
        .ct-bottom>li{
            border-bottom: 5px solid #555;
            float: left;
            cursor: pointer;
            width: 20px;
            margin: 0 5px;
            border-radius: 2px;
        }
        .ct-bottom{
            position: absolute;
            top: 180px;
            left: 95px;
        }
        .ct{
            position: relative;
        }
        a.change{
            text-decoration: none;
            font-size: larger;
            font-weight: 900;
            background-color: #666;
            color: #fff;
            display: inline-block;
            vertical-align: middle;
            padding: 15px;
            width: 10px;
            height: 10px;
            line-height: 10px;
            border-radius: 25px;
            opacity: 0.7;
        }
        a.pre{
            position: absolute;
            left: 10px;
            top: 80px;
        }
        a.next{
            position: absolute;
            left: 250px;
            top: 80px;
        }
        a.change:hover{
            background-color: #444;
        }

    </style>
</head>
<body>
<div id="wrap">
    <div class="ct">
        <ul class="clearfix ct-img">
            <li data-nub="0"><a href="#">![](http://upload-images.jianshu.io/upload_images/2166980-fa29da09e1abe792.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)</a></li>
            <li data-nub="1"><a href="#">![](http://upload-images.jianshu.io/upload_images/2166980-0ed4f2fd9ea0b571.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)</a></li>
            <li data-nub="2"><a href="#">![](http://upload-images.jianshu.io/upload_images/2166980-e181309822223f13.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)</a></li>
            <li data-nub="3"><a href="#">![](http://upload-images.jianshu.io/upload_images/2166980-beeaa45457e1cc51.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)</a></li>
        </ul>
        <ul class="ct-bottom clearfix">
            <li></li>
            <li></li>
            <li></li>
            <li></li>
        </ul>
        <a href="####" class="pre change"> < </a>
        <a href="####" class="next change"> > </a>

    </div>
    <div class="ct">
        <ul class="clearfix ct-img">
            <li data-nub="0"><a href="#">![](http://upload-images.jianshu.io/upload_images/2166980-e181309822223f13.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)</a></li>
            <li data-nub="1"><a href="#">![](http://upload-images.jianshu.io/upload_images/2166980-0ed4f2fd9ea0b571.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)</a></li>
            <li data-nub="2"><a href="#">![](http://upload-images.jianshu.io/upload_images/2166980-fa29da09e1abe792.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)</a></li>
            <li data-nub="3"><a href="#">![](http://upload-images.jianshu.io/upload_images/2166980-beeaa45457e1cc51.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)</a></li>
        </ul>
        <ul class="ct-bottom clearfix">
            <li></li>
            <li></li>
            <li></li>
            <li></li>
        </ul>
        <a href="####" class="pre change"> < </a>
        <a href="####" class="next change"> > </a>

    </div>
    <div class="ct">
        <ul class="clearfix ct-img">
            <li data-nub="0"><a href="#">![](http://upload-images.jianshu.io/upload_images/2166980-fa29da09e1abe792.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)</a></li>
            <li data-nub="1"><a href="#">![](http://upload-images.jianshu.io/upload_images/2166980-0ed4f2fd9ea0b571.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)</a></li>
            <li data-nub="2"><a href="#">![](http://upload-images.jianshu.io/upload_images/2166980-e181309822223f13.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)</a></li>
            <li data-nub="3"><a href="#">![](http://upload-images.jianshu.io/upload_images/2166980-beeaa45457e1cc51.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)</a></li>
        </ul>
        <ul class="ct-bottom clearfix">
            <li></li>
            <li></li>
            <li></li>
            <li></li>
        </ul>
        <a href="####" class="pre change"> < </a>
        <a href="####" class="next change"> > </a>

    </div>
</div>
<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/1.9.1/jquery.min.js"></script>
<script>


/* 自定義jQuery方法(開發(fā)jQuery插件常用此方法) 其實 $.fn === $.prototype */
    $.fn.allGo = function() {
        var $me=$(this),
            $ctImg=$me.find(".ct-img"),
            $ctBottom=$me.find(".ct-bottom"),
            $next=$me.find(".next"),
            $pre=$me.find(".pre"),
            $ctBottomLi=$me.find(".ct-bottom>li"),
            clock=false,
            cur=0;
        show(0);
        setInterval(function () {
            playNext()
        }, 2000);

        function show(num) {
            if (clock) {
                return;
            }
            clock = true;
            $ctBottom.children().eq(num).css("border-bottom-color", "white");
            $ctBottom.children().eq(num).siblings().css("border-bottom-color", "#555");
            $ctImg.children().eq(num).siblings().css("display", "none");
            $ctImg.children().eq(num).fadeOut(500);
            $ctImg.children().eq(num).fadeIn(500, function () {
                clock = false
            });
            cur = num;
            return cur;
        }

        function playNext() {
            var nextNum = cur + 1;
            if (nextNum === 4) {
                show(0)
            }
            else show(nextNum)
        }

        $next.on("click", function () {
            playNext();
        });

        $pre.on("click", function () {
            playPre();
        });

        function playPre() {
            var preNum = cur - 1;
            if (preNum === -1) {
                show(3)
            }
            else show(preNum)
        }

        $ctBottomLi.on("click", function () {
            var $cur = $(this),
                indexNum = $cur.index();
                show(indexNum);
        });

    };

    $(".ct").each(function () {
        $(this).allGo();
    });
</script>

</body>
</html>

預(yù)覽地址：http://htmlpreview.github.io/?https://github.com/have-not-BUG/task/blob/master/renwu/renwu27/renwu27-2.html

3、無縫輪播

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>27-1無限輪播</title>
    <style>
        ul,li{
            list-style: none;
        }

        *{
            margin: 0;
            padding: 0;
        }

        .ct-img>li{
            float: left;
            width: 310px;
            height: 210px;


        }
        .ct-img{
            position: absolute;

        }
        img{
            width: 310px;
            height: 210px;
        }

        .clearfix:after{
            content: "";
            display: block;
            clear: both;
        }
        .ct-bottom>li{
            border-bottom: 5px solid #555;
            float: left;
            cursor: pointer;
            width: 20px;
            margin: 0 5px;
            border-radius: 2px;
        }
        .ct-bottom{
            position: absolute;
            top: 180px;
            left: 95px;
        }
        .ct{
            position: relative;
            height: 210px;
            width: 310px;
            overflow: hidden;

        }
        a.change{
            text-decoration: none;
            font-size: larger;
            font-weight: 900;
            background-color: #666;
            color: #fff;
            display: inline-block;
            vertical-align: middle;
            padding: 15px;
            width: 10px;
            height: 10px;
            line-height: 10px;
            border-radius: 25px;
            opacity: 0.7;
        }
        a.pre{
            position: absolute;
            left: 10px;
            top: 80px;
        }
        a.next{
            position: absolute;
            left: 250px;
            top: 80px;
        }
        a.change:hover{
            background-color: #444;
        }

    </style>
</head>
<body>
<div class="ct">
    <ul class="clearfix ct-img">
        <li data-nub="0"><a href="#">![](http://upload-images.jianshu.io/upload_images/2166980-6ab5d1205bf5e648.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)</a></li>
        <li data-nub="1"><a href="#">![](http://upload-images.jianshu.io/upload_images/2166980-4a650bbc5c4aa561.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)</a></li>
        <li data-nub="2"><a href="#">![](http://upload-images.jianshu.io/upload_images/2166980-3f5ed4941a5622a1.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)</a></li>
        <li data-nub="3"><a href="#">![](http://upload-images.jianshu.io/upload_images/2166980-5e9ce2909a791c90.jpg?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)</a></li>
    </ul>
    <ul class="ct-bottom clearfix">
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>
    <a href="####" class="pre change"> < </a>
    <a href="####" class="next change"> > </a>

</div>
<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
    var imgWidth=$(".ct-img").children().width(),
            clock=false,
            nextClock=false,
           $liImg=$(".ct-img").children(),
           imgCount=$liImg.size();

    $(".ct-img").append($liImg.first().clone());
    $(".ct-img").prepend($liImg.last().clone());
    imgTrueCount=$(".ct-img").children().length;
    $(".ct-img").css({"left":0-imgWidth,"width":imgTrueCount*imgWidth});




    function showMe(num) {
        if (clock){return}
        clock=true;
        if (-1<num<imgCount){
            $(".ct-bottom").children().eq(num).css("border-bottom-color","white");
            $(".ct-bottom").children().eq(num).siblings().css("border-bottom-color","#555");
            $(".ct-img").animate({left:"-"+imgWidth*(num+1)});
        }
        if (num===imgCount){
            $(".ct-img").animate({"left":"-"+imgWidth*(imgCount+1)},function () {
                $(".ct-img").css("left",0-imgWidth);
            });
            $(".ct-bottom").children().eq(0).css("border-bottom-color","white");
            $(".ct-bottom").children().eq(0).siblings().css("border-bottom-color","#555");

        }
        if (num===-1){
            $(".ct-img").animate({"left":"0"},function () {
                $(".ct-img").css("left",0-imgWidth*imgCount);

            });
            $(".ct-bottom").children().eq(imgCount-1).css("border-bottom-color","white");
            $(".ct-bottom").children().eq(imgCount-1).siblings().css("border-bottom-color","#555");

        }

        myIndex=num;
        clock=false;
        nextClock=false;
        return myIndex;
    }

    function playNext() {
        if (myIndex===imgCount){
            myIndex=0;
            showMe(myIndex+1);
            return ;
        }
        showMe(myIndex+1);

    }

    function playPre() {

        if (myIndex===-1){
            myIndex=imgCount-2;
            showMe(myIndex);
            return ;
        }
        showMe(myIndex-1)
    }


    $(".next").on("click",function () {

           clearTimeout(timing);
            playNext();
            circulate();
    });

    $(".pre").on("click",function () {
        clearTimeout(timing);
        playPre();
        circulate();

    });

    showMe(0);

    circulate();

    function circulate() {
        timing=setTimeout(function () {
            playNext();
            circulate();
        },3000);
    }


    $(".ct-bottom").children().on("click", function () {
        clearTimeout(timing);
        var $cur = $(this),
                indexNum = $cur.index();
        if (indexNum===0){
            showMe(imgCount);
        }
        else   showMe(indexNum);
        circulate();
    });


</script>

</body>
</html>

預(yù)覽地址：http://htmlpreview.github.io/?https://github.com/have-not-BUG/task/blob/master/renwu/renwu27/renwen27-3.html

4、全屏無縫輪播

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>27-4無限輪播</title>
    <style>
        ul,li{
            list-style: none;
        }

        *{
            margin: 0;
            padding: 0;
        }
        body,html,.wrap,.ct-bg{
            width: 100%;
            height: 100%;
        }
        .wrap{
            position: relative;
            overflow: hidden;

        }
        .ct-bg{
            position: absolute;

        }

        .ct-bg>li{
            float: left;
            height: 100%;
            width: 100%;
            text-align: center;
            position: relative;
        }
        .bg{
            background-image:url("http://cdn.jirengu.com/book.jirengu.com/img/6.jpg");
            background-size: cover;
            background-repeat: no-repeat;
            background-position: center center;
            height: 100%;
            width: 100%;
            position: absolute;

        }

        .clearfix:after{
            content: "";
            display: block;
            clear: both;
        }

        .ct-bg .ct-text{
            position: absolute;
            top:50%;
            left: 50%;
            transform: translate(-50%, -50%);
        }

        .ct-text>h1{
            padding-bottom: 20px;
        }

        .ct-bottom{
            position: absolute;
            bottom: 10px;
            left: 50%;
            transform: translateX(-50%);
        }

        .ct-bottom>li{
            border-bottom: 5px solid #555;
            float: left;
            cursor: pointer;
            width: 20px;
            margin: 0 5px;
            border-radius: 2px;
        }


        a.change{
            text-decoration: none;
            font-size: larger;
            font-weight: 900;
            background-color: #666;
            color: #fff;
            display: inline-block;
            vertical-align: middle;
            padding: 15px;
            width: 10px;
            height: 10px;
            line-height: 10px;
            border-radius: 25px;
            opacity: 0.7;
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
        }
        a.pre{
            left: 50px;
        }
        a.next{
            right: 50px;
        }
        a.change:hover{
            background-color: #444;
        }

    </style>
</head>
<body>
<div class="wrap">
    <ul class="clearfix ct-bg">
        <li>
            <div class="bg" data-bg="http://cdn.jirengu.com/book.jirengu.com/img/6.jpg"></div>
            <div class="ct-text">
            <h1>我是第一張</h1>
            <h3>我是標題</h3>
            </div>
        </li>
        <li>
            <div class="bg" data-bg="http://cdn.jirengu.com/book.jirengu.com/img/7.jpg"></div>
            <div class="ct-text">
                <h1>我是第二張</h1>
                <h3>我是標題</h3>
            </div>
        </li>
        <li>
            <div class="bg" data-bg="http://cdn.jirengu.com/book.jirengu.com/img/8.jpg"></div>
            <div class="ct-text">
                <h1>我是第三張</h1>
                <h3>我是標題</h3>
            </div>
        </li>
        <li>
            <div class="bg" data-bg="http://cdn.jirengu.com/book.jirengu.com/img/9.jpg"></div>
            <div class="ct-text">
                <h1>我是第四張</h1>
                <h3>我是標題</h3>
            </div>
        </li>

    </ul>
    <ul class="ct-bottom clearfix">
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>
    <a href="####" class="pre change"> < </a>
    <a href="####" class="next change"> > </a>

</div>
<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/1.9.1/jquery.min.js"></script>
<script>

    var bgLiWidth=$(".ct-bg").children().width(),
            clock=false,
            nextClock=false,
            $bgLi=$(".ct-bg").children(),
            bgCount=$bgLi.size();

    $(".ct-bg").append($bgLi.first().clone());
    $(".ct-bg").prepend($bgLi.last().clone());
    bgTrueCount=$(".ct-bg").children().length;
    $(".ct-bg").css({"left":0-bgLiWidth,"width":bgTrueCount*bgLiWidth});
    $(".ct-bg").children().width(bgLiWidth);


    function showMe(num) {
        if (clock){return}
        clock=true;
        if (-1<num<bgCount){
            $(".ct-bottom").children().eq(num).css("border-bottom-color","white");
            $(".ct-bottom").children().eq(num).siblings().css("border-bottom-color","#555");
            $(".ct-bg").animate({left:"-"+bgLiWidth*(num+1)});

            isSetBgUrl();
            function isSetBgUrl() {
                if ($(".bg").eq(num+1).data("setBgUrl"))  {return;}
                else {trueBgUrl=$(".ct-bg .bg").eq(num+1).attr("data-bg");
                    $(".bg").eq(num+1).css("background-image",'url('+trueBgUrl+')');
                    $(".bg").eq(num+1).data("setBgUrl",true) ;
                }
            }



        }
        if (num===bgCount){
            $(".ct-bg").animate({"left":"-"+bgLiWidth*(bgCount+1)},function () {
                $(".ct-bg").css("left",0-bgLiWidth);
            });
            $(".ct-bottom").children().eq(0).css("border-bottom-color","white");
            $(".ct-bottom").children().eq(0).siblings().css("border-bottom-color","#555");

        }
        if (num===-1){
            $(".ct-bg").animate({"left":"0"},function () {
                $(".ct-bg").css("left",0-bgLiWidth*bgCount);

            });
            $(".ct-bottom").children().eq(bgCount-1).css("border-bottom-color","white");
            $(".ct-bottom").children().eq(bgCount-1).siblings().css("border-bottom-color","#555");

        }

        myIndex=num;
        clock=false;
        nextClock=false;
        return myIndex;
    }

    function playNext() {
        if (myIndex===bgCount){
            myIndex=0;
            showMe(myIndex+1);
            return ;
        }
        showMe(myIndex+1);

    }

    function playPre() {

        if (myIndex===-1){
            myIndex=bgCount-2;
            showMe(myIndex);
            return ;
        }
        showMe(myIndex-1)
    }


    $(".next").on("click",function () {

        clearTimeout(timing);
        playNext();
        circulate();
    });

    $(".pre").on("click",function () {
        clearTimeout(timing);
        playPre();
        circulate();

    });

    showMe(0);

    circulate();

    function circulate() {
        timing=setTimeout(function () {
            playNext();
            circulate();
        },3000);
    }


    $(".ct-bottom").children().on("click", function () {
        clearTimeout(timing);
        var $cur = $(this),
                indexNum = $cur.index();
        if (indexNum===0){
            showMe(bgCount);
        }
        else   showMe(indexNum);
        circulate();
    });


</script>

</body>
</html>

預(yù)覽地址：http://htmlpreview.github.io/?https://github.com/have-not-BUG/task/blob/master/renwu/renwu27/renwu27-4.html

**本文版權(quán)歸本人即簡書筆名：該賬戶已被查封所有，如需轉(zhuǎn)載請注明出處。謝謝！ *

最后編輯于：2018.01.27 10:04:14

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務(wù)。

人面猴
序言：七十年代末，一起剝皮案震驚了整個濱河市，隨后出現(xiàn)的幾起案子，更是在濱河造成了極大的恐慌，老刑警劉巖，帶你破解...
沈念sama閱讀 227,797評論 6贊 531
死咒
序言：濱河連續(xù)發(fā)生了三起死亡事件，死亡現(xiàn)場離奇詭異，居然都是意外死亡，警方通過查閱死者的電腦和手機，發(fā)現(xiàn)死者居然都...
沈念sama閱讀 98,179評論 3贊 414
救了他兩次的神仙讓他今天三更去死
文/潘曉璐我一進店門，熙熙樓的掌柜王于貴愁眉苦臉地迎上來，“玉大人，你說我怎么就攤上這事。” “怎么了？”我有些...
開封第一講書人閱讀 175,628評論 0贊 373
道士緝兇錄：失蹤的賣姜人
文/不壞的土叔我叫張陵，是天一觀的道長。經(jīng)常有香客問我，道長，這世上最難降的妖魔是什么？我笑而不...
開封第一講書人閱讀 62,642評論 1贊 309
?港島之戀（遺憾婚禮）
正文為了忘掉前任，我火速辦了婚禮，結(jié)果婚禮上，老公的妹妹穿的比我還像新娘。我一直安慰自己，他們只是感情好，可當我...
茶點故事閱讀 71,444評論 6贊 405
惡毒庶女頂嫁案：這布局不是一般人想出來的
文/花漫我一把揭開白布。她就那樣靜靜地躺著，像睡著了一般。火紅的嫁衣襯著肌膚如雪。梳的紋絲不亂的頭發(fā)上，一...
開封第一講書人閱讀 54,948評論 1贊 321
城市分裂傳說
那天，我揣著相機與錄音，去河邊找鬼。笑死，一個胖子當著我的面吹牛，可吹牛的內(nèi)容都是我干的。我是一名探鬼主播，決...
沈念sama閱讀 43,040評論 3贊 440
雙鴛鴦連環(huán)套：你想象不到人心有多黑
文/蒼蘭香墨我猛地睜開眼，長吁一口氣：“原來是場噩夢啊……” “哼！你這毒婦竟也來了？” 一聲冷哼從身側(cè)響起，我...
開封第一講書人閱讀 42,185評論 0贊 287
萬榮殺人案實錄
序言：老撾萬榮一對情侶失蹤，失蹤者是張志新（化名）和其女友劉穎，沒想到半個月后，有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體，經(jīng)...
沈念sama閱讀 48,717評論 1贊 333
?護林員之死
正文獨居荒郊野嶺守林人離奇死亡，尸身上長有42處帶血的膿包…… 初始之章·張勛以下內(nèi)容為張勛視角年9月15日...
茶點故事閱讀 40,602評論 3贊 354
?白月光啟示錄
正文我和宋清朗相戀三年，在試婚紗的時候發(fā)現(xiàn)自己被綠了。大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
茶點故事閱讀 42,794評論 1贊 369
活死人
序言：一個原本活蹦亂跳的男人離奇死亡，死狀恐怖，靈堂內(nèi)的尸體忽然破棺而出，到底是詐尸還是另有隱情，我是刑警寧澤，帶...
沈念sama閱讀 38,316評論 5贊 358
?日本核電站爆炸內(nèi)幕
正文年R本政府宣布，位于F島的核電站，受9級特大地震影響，放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜，卻給世界環(huán)境...
茶點故事閱讀 44,045評論 3贊 347
男人毒藥：我在死后第九天來索命
文/蒙蒙一、第九天我趴在偏房一處隱蔽的房頂上張望。院中可真熱鬧，春花似錦、人聲如沸。這莊子的主人今日做“春日...
開封第一講書人閱讀 34,418評論 0贊 26
一樁弒父案，背后竟有這般陰謀
文/蒼蘭香墨我抬頭看了看天上的太陽。三九已至，卻和暖如春，著一層夾襖步出監(jiān)牢的瞬間，已是汗流浹背。一陣腳步聲響...
開封第一講書人閱讀 35,671評論 1贊 281
情欲美人皮
我被黑心中介騙來泰國打工，沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留，地道東北人。一個月前我還...
沈念sama閱讀 51,414評論 3贊 390
代替公主和親
正文我出身青樓，卻偏偏與公主長得像，于是被迫代替她去往敵國和親。傳聞我的和親對象是個殘疾皇子，可洞房花燭夜當晚...
茶點故事閱讀 47,750評論 2贊 370

三个男躁一个女,国精产品一区一手机的秘密,麦子交换系列最经典十句话,欧美国产综合欧美视频

輪播實現(xiàn)方法

輪播實現(xiàn)方法

推薦閱讀更多精彩內(nèi)容

三个男躁一个女,国精产品一区一手机的秘密,麦子交换系列最经典十句话,欧美 国产 综合 欧美 视频

輪播實現(xiàn)方法

推薦閱讀更多精彩內(nèi)容

三个男躁一个女,国精产品一区一手机的秘密,麦子交换系列最经典十句话,欧美国产综合欧美视频