仿百度新闻首页右侧浮动二维码扫描

百度新闻右侧的浮动二维码扫描的效果感觉不错,在这里给出源码~~可以自己改动

 

 

<div id="identifier-pannel" style="display:none"><a href="http://zeq9069.duapp.com" target="_blank">注入木马的APK<br>(测试端)<img src="facvion.ico" height="90" width="90"/>点击或扫描下载</a></div>
<style type="text/css">
#header.for-ipad-style{
    background:url(http://news.baidu.com/resource/img/video_app_tuiguang/video_ipadapp_header_bg.png) no-repeat right bottom;
    background-size:210px 68px;
    -webkit-background-size:210px 68px;
}
#identifier-pannel{
    position:fixed;
    left: 50%;
    bottom:0;
    z-index:9999;
    width:110px;
    margin-left:517px;
}
#identifier-pannel a:link,#identifier-pannel a:visited{
    display:block;
    padding:10px;
    line-height:18px;
    font-size:12px;
    color:#333;
    text-decoration:none;
    white-space:nowrap;
    text-align:center;
    background:#f9f9f9;
}
#identifier-pannel a:hover{
    background:#ccd8db;
    color:#000;
}
#identifier-pannel img{
    display:block;
    margin:5px auto;
    border:none;
}


</style>

<script type="text/javascript">
(function (){
    /*temp for ad-for-ipad*/
    if(navigator.userAgent.match(/(iPad).*OS\s([\d_]+)/)){
        document.getElementById('header').className = 'for-ipad-style';
        document.getElementById('searchbox_tuiguang').setAttribute('mon' , 'col=504');
        document.getElementById('searchbox_tuiguang').href='http://itunes.apple.com/cn/app/bai-du-shi-pinhd/id573885698?mt=8';

    }

    window.onload = function(){
    function fixedBar(id, options){
                /*temp
                {
                    addclass : 'string',
                    top : number,
                    autoHidden : true,
                    show : true
                }
                */
         var ele = document.getElementById(id);
             if(!ele) return;
             if(/msie (\d+\.\d+)/i.test(navigator.userAgent)){
                var pageHeight=window.innerHeight;
                var d=document;
                    if(typeof pageHeight!="number"){
                            if(document.compatMode=="CSS1Compat"){
                                    pageHeight=document.documentElement.clientHeight;
                            }else{
                                    pageHeight=document.body.clientHeight;
                            }
                    }
                var ieScrollTop=window.pageYOffset || d.documentElement.scrollTop || d.body.scrollTop;
                    if(options.addclass) ele.className = options.addclass;
                    ele.style.position= 'absolute';

                    if(options.show){
                        ele.style.top = ieScrollTop+pageHeight-options.top + "px";
                        ele.style.display= 'block';
                    }

                    window.attachEvent('onscroll' , function (){

                            var ieScrollTop=window.pageYOffset || d.documentElement.scrollTop || d.body.scrollTop;

                            ele.style.top = ieScrollTop+pageHeight - options.top + "px";
                            //ele.style.top=ieScrollTop+pageHeight-111-71+"px";
                            if(options.autoHidden){
                                    if(ieScrollTop==0){
                                            ele.style.display="none";
                                    }else{
                                            ele.style.display="block";
                                    }
                            }
                    });
            }else{
                var ele = document.getElementById(id);
                if(typeof pageHeight!="number"){
                        if(document.compatMode=="CSS1Compat"){
                                pageHeight=document.documentElement.clientHeight;
                        }else{
                                pageHeight=document.body.clientHeight;
                        }
                }
                if(options.show) ele.style.display= 'block';
                ele.style.top = pageHeight-options.top+'px';
                window.addEventListener('scroll',function (){
                    if(options.autoHidden){
                            if(baidu.page.getScrollTop()==0){
                                    ele.style.display="none";
                            }else{
                                    ele.style.display="block";
                            }
                    }
                },false);
            }
    }

    fixedBar('backTopBtn' , {autoHidden: true, top : 186});
    fixedBar('identifier-pannel' , {autoHidden: false , top : 386 , show : true});
    }
})();
</script>


 

 

截图:

 

 

 

 

 

 

 

转自:http://wenku.baidu.com/view/012ef021915f804d2b16c1f3.html###

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值