荣耀彩票代理

IT技术互动交流平台

类垂直站点插件实现与分享

作者:谢灿勇  发布日期:2016-12-19 20:32:10

LAIZIGUANGDONGDIQUDEXIAOHUOBANMENHUODUOHUOSHAODOUTINGSHUOGUOFEILVBINHAIWAICHENGXUYUANPAIQIANBA,TEBIESHISHENZHENHEGUANGZHOUDIQUDEZHAOPINQUNZHONGJINGCHANGCHUXIANZHEIYANGDEXINXI,YIGEOURANDEJIHUI,BOZHUZAIWUYIZHONGLIULANFAXIANYOUYIJIABOCAIGONGSIDEZHUCEDIZHISHIFEILVBIN,ERQIEZAIGUONEIKAISHEWANGLUODUBO(ZHEILIWANGZHANJIUBUTOULULE)。BOZHUFAXIANSUIRANZHANDIANSHIFEIFADE,HAISHIYOUHENDUOZAIZHANDIANDESHEJIDEFEICHANGHAO,ZHIDEWOMENQUXUEXIDE,SUOYIJIUFANGZHAOLEYIXIABIERENJIADEWANGZHAN,ZIJIZHONGGOULEYIXIALEISIFENGGEDECHAJIANCHULAI。(CHAJIANMUQIANWEI1.0BANBEN,WENDINGXINGBUGAO,BUJIANYISHANGYESHIYONG,DANSHIXUEXIYIXIAHAISHIKEYIDE)

一、插件的设计思想

ZHEIKUANCHAJIANZHUYAOSHIYONGLAIJIEJUECEBIANGUDINGLANDESHIXIANDEGONGNENGDE。GAICHAJIANDESHEJISILUBIQIjPage.jsYOUSUOCHUANGXIN(XINLAIDEXIAOHUOBANMENKENENGBUTAIQINGCHU,jPage.jsJIUSHIBOZHUZHIQIANFENXIANGGUODEYIKUANLEIDIANSHANGDEFENYECHAJIAN,XIANGQINGQINGKAN),YOULEBIJIAODADETUPO,ZHIQIANXIANGDANGYUJIUSHIYIGEFANGFAYIGEFANGFADEDIAOYONG,DANSHIXIANZAIDESHEJIJIUSHIXIANGDANGYUYOUYIGEFULEICHUSHIHUALEYIXIEGONGGONGDEFANGFA,RANHOUTONGGUOZILEIJICHENGFULEIDEXINGSHI,JIANGFULEIDEZHICHUANDIJIZILEI,ZILEIGAIBIANZHIZHONGXINCHUANJIFULEI,CONGERDADAOLEBUTONGZILEIZHIJIANDEXINXIGONGXIANGYUCHUANDI。TULIRUXIA:

荣耀彩票代理QIZHONGFULEIInitCHUSHIHUALEIZHONGJIANGYAOSHIYONGDAODEBIANLIANG,validateZHONGDUICHENGXUDEYUNXINGJIEGUOJINXINGYANZHENGBAOZHENGCHUANRUDECANSHUSHIZHENGQUEDE,drawZHEIGEFANGFASHIYONGLAIDUICHUANRUCANSHUJINXINGHUIZHIDE,ZUIHOUZAIWAIBUDUIinitZHONGJINXINGSHIJIANBANGDING,ZHEIYANGWOMENJIUNENGGOUHENJIANDANDETONGGUOYIGEmainFANGFALAInew YIGEinitCONGERDADAOCELANHUIZHIDEXIAOGUO

二、插件简单DEMO
<!DOCTYPE html>
<html lang='en'>
<head>
    <meta charset='UTF-8'>
    <title>mulTSideBar DEMO</title>
</head>
<body style='height:1200px'>
    <div id='test'></div>
    <script type='text/javascript' src='http://cdn.bootcss.com/jquery/3.1.1/jquery.min.js'></script>
    <script type='text/javascript' src='multSideBar.js'></script>
    <script type='text/javascript'>

        /*
         *author:leslieSie 
         *description:关于MultSideBar插件的简单应用
         *time:2016/12/11
         */
        $('#test').multSideBar({
            goTopControl:true,
            show:{
                data:[
                {
                    icon:'weibo',   //weixin,qq,facebook,taobao,zhifubao,weibo
                    type:'hollow',   //可选参数有hollow,solid
                    noCustom:true,    //自定义类型,只有在custom为true的时候,customUrl才有效
                    text:'微博',
                    customUrl:'',    //图片的URL
                    click:function(){  
                        window.location.href='http://www.weibo.com';
                    },         
                },{
                    icon:'weibo',   //weixin,qq,facebook,taobao,zhifubao,weibo
                    type:'hollow',   //可选参数有hollow,solid
                    noCustom:false,    //自定义类型,只有在custom为true的时候,customUrl才有效
                    text:'小兔子',
                    customUrl:'img/custom.svg',    //图片的URL
                    click:function(){
                        window.location.href='http://www.baidu.com';
                    },        //点击后的效果        
                },{
                    icon:'goTop',   //weixin,qq,facebook,taobao,zhifubao,weibo
                    type:'solid',   //可选参数有hollow,solid
                    noCustom:true,    //自定义类型,只有在custom为true的时候,customUrl才有效
                    text:'置顶',
                    customUrl:'',    //图片的URL
                }]
            }
        });
    </script>
</body>
</html> 

YUNXINGXIAOGUORUXIA:

GENGDUODEPEIZHIQINGDAOgitSHANGMIANYUEDUreadmeWENJIAN,DIZHI:http://github.com/leslieSie/font-end-tools/tree/master/jquery/multSideBar

三、插件版本规划

 YOUYUZHEIKUANCHAJIANYUQISHIYAOZAIXINGQILIUDESHIHOUFABUDE,YOUYUCHUXIANYIDIANBIANDONGDANWULEFABUSHIJIAN,SUOYI1.0BANBENZAICONGMANGZHONGJINJIFABU,YINCINANMIANHUIYOUYIXIEXIACI,SUOYIZAI1.1BANBENZHONGHUIXIUFUDAJIASUOTIJIAODEBug,TIANJIATUBIAODEpopupGONGNENG(ZHEIGEGONGNENGLEISIYUhoverXIANSHIWEIXINERWEIMA),YUNXUTOUMINGDUDINGZHIDENGWENTIDETIANJIAYUXIUFU。RUGUONIJUEDEZANDEHUA,QINGZAIYOUXIAJIAODIANZAN,HUOZHEJIYUXIAOEDEZIJINZIZHU,YIGONGBOZHUKEYIJIXUDEJINXINGKAIYUANXIANGMUDEKAIFA。

同时博主承接插件商业化定制服务

Tag标签:      
  • 专题推荐

About IT165 - 广告服务 - 隐私声明 - 版权申明 - 免责条款 - 网站地图 - 网友投稿 - 联系方式
本站内容来自于互联网,仅供用于网络技术学习,学习中请遵循相关法律法规