欧美日韩人妻,无码精品少妇,成人H动漫精品一区二区三区蘑菇

    284292114@qq.com 中國站
    行業(yè)新聞 網(wǎng)站建設(shè) 網(wǎng)絡(luò)推廣 首頁>新聞中心>網(wǎng)站建設(shè)

    隨機輸出數(shù)據(jù)實現(xiàn)彈幕效果。

    時間:2020-12-14   訪問量:0


    有朋友看中了別人網(wǎng)站的彈幕效果,但是想拔那個效果,我看了一下太過于復(fù)雜。百度上找了一下素材,發(fā)現(xiàn)下面這個特別簡單。先引入JQ,然后在網(wǎng)頁底部加入以下代碼就可以實現(xiàn)了。

    其中的

    {pboot:list scode=8 num=10}
        
    [list:title lencn=10]
        {/pboot:list}

    是調(diào)用的后臺數(shù)據(jù),如果你使用的是DEDE,可以換成DEDE的標簽即可。


    image.png


    直接上代碼。


     
    
            .barrager{width:100%; margin:0 auto;height:500px;overflow:hidden;position:fixed; bottom: 0; left:0; z-index: 9999999999999999999999999;}
            .barrager div{position:absolute; }
             .barrager div span{  height: 30px; line-height: 30px; background:rgba(0,0,0,0.3); border-radius: 20px; padding:5px 15px;}   
            
     
        
    
      {pboot:list scode=8 num=10}
        
    [list:title lencn=10]
        {/pboot:list}




        $(function () {
            $(".barrager").barrager()
        });
        (function () {
            var Barrager = function (ele,options) {
                var defaults = {
                    color:["#ee0038","#00f300","#fdef13","#fff","#fd13f5","#05fff6","#c445ff","#fff"],
                    wrap:ele
                };
                this.settings = $.extend({},defaults,options||{});
                this._init();
                this.bindEven();
            };
            Barrager.prototype = {
                _init:function () {
                    var item = $(this.settings.wrap).find("div");
                    for(var i = 0;i                    item.eq(i).css({
                            top:this.getReandomTop()+"px",
                            color:this.getReandomColor(),
                            fontSize:this.getReandomSize()+"px"
                        });
                        item.eq(i).css({
                            right:-item.eq(i).width()
                        })
                    }
                    this.randomTime(0);
                },
                bindEven:function () {
                    var _this = this;
                    $(".addBarrager .submit").on('click',function () {
                        _this._click(_this);
                    });
                },
                getReandomColor:function () {
                    var max = this.settings.color.length;
                    var randomNum = Math.floor(Math.random()*max);
                    return this.settings.color[randomNum];
                },
                getReandomTop:function () {
                    var top = (Math.random()*450).toFixed(1);
                    return top;
                },
                getReandomSize:function () {
                    var size = (12+Math.random()*16);
                    return size;
                },
                getReandomTime:function () {
                    var time = Math.floor((8+Math.random()*10));
                    return time*1000;
                },
                randomTime:function (n) {
                    var obj = $(this.settings.wrap).find("div");
                    var _this = this;
                    var len = obj.length;
                    if(n>=len){
                        n=0;
                    }
                    setTimeout(function () {
                        n++;
                        _this.randomTime(n)
                    },1000);
                    var item = obj.eq(n),_w = item.outerWidth(!0);
                    item.animate({
                        left:-_w
                    },_this.getReandomTime(),"linear",function () {
                        item.css({right:-_w,left:""});
                        _this.randomTime(n)
                    });
                },
                _click:function (obj) {
                    var _this = obj;
                    var _val = $(".barVal");
                    if(_val.val() == ""){
                        alert("請描述你對TA的印象!");
                        return false;
                    }
                    $(_this.settings.wrap).append("
    "+_val.val()+"
    ");
                    _this._init();
                    _val.val("");
                }
            };
            $.fn.barrager = function (opt) {
                var bger = new Barrager(this,opt);
            }
        })(jQuery);


    服務(wù)咨詢
    1對1咨詢,專業(yè)客服為您解疑答惑
    聯(lián)系銷售
    15899750475
    在線咨詢
    聯(lián)系在線客服,為您解答所有的疑問
    ARE YOU INTERESTED IN ?
    感興趣嗎?

    有關(guān)我們服務(wù)的更多信息,請聯(lián)系項目經(jīng)理

    15899750475 楊先生