当前位置:清晨 » javascript笔记

  • jq实现图片宽度自适应100%且图片高度等于图片宽度

    2018年12月08日 | 作者: 影子 | 评论数:0

    jq实现图片宽度自适应100%且图片高度等于图片宽度
    使用jq计算出宽度,再设置高度 ;(function($){ $(function(){ var $divWidth = $('xxx').width(); $('img').css({'height':$divWidth}); }) })(jQuery) 或者使用css3 img{width:100vw;height:100vw;}        

    标签:, , ,

  • 电影站使用DPlayer播放器不能全屏播放的解决办法

    2018年11月17日 | 作者: 影子 | 评论数:0

    电影站使用DPlayer播放器不能全屏播放的解决办法
    很多电影站会使用在线播放器,其中Dplayer播放器是比较常用的一个。 有时会遇到DPlayer播放器的全屏功能失效的情况。 今天影子就分享一下解决方法。 只需要在 iframe 代码中,添加两段代码 allowtransparency="true" allowfullscreen="true" 修改后的代码 document.write('<iframe width="100%" height="10...

    标签:

  • jQuery 文档操作方法

    2018年09月15日 | 作者: 影子 | 评论数:0

    jQuery 文档操作方法
    这些方法对于 XML 文档和 HTML 文档均是适用的,除了:html()。 方法 描述 addClass() 向匹配的元素添加指定的类名。 after() 在匹配的元素之后插入内容。 append() 向匹配元素集合中的每个元素结尾插入由参数指定的内容。 appendTo() 向目标结尾插入匹配元素集合中的每个元素。 attr() 设置或返...

    标签:

  • select列表框中的option选项显示图片

    2018年08月18日 | 作者: 影子 | 评论数:0

    select列表框中的option选项显示图片
    <img id="image1" src=""> <select onchange="image1.src=this.value"> <option value="images/main.png" >main.png</option> <option value="images/tel.png">tel.png</option> <option value="images/mail.png">mail.png</option> </select>

    标签:

  • js点击按钮显示或隐藏内容

    2018年08月07日 | 作者: 影子 | 评论数:0

    js点击按钮显示或隐藏内容
    js点击按钮显示或隐藏内容,可以做手机版的菜单功能,比较方便. js代码 <script type="text/javascript"> window.onload=function(){ var obt=document.getElementById("all"); var odiv=document.getElementById("menu"); obt.onclick=function(){ if(odiv.style.display=="none"){ ...

    标签:

  • 原生js图片替换位置

    2018年08月01日 | 作者: 影子 | 评论数:0

    原生js图片替换位置
    原生js图片替换位置     <script> function changeImg(id,img) { document.getElementById(id).src =img; } </script> <p><img src="https://www.baidu.com/img/baidu_jgylogo3.gif" id="baidu"/></p> <p><img src="https://www.baidu.com/img/baidu_jgylog...

    标签:

  • js实现tab切换,支持单页面多个调用

    2018年06月19日 | 作者: 影子 | 评论数:0

    js实现tab切换,支持单页面多个调用
    js代码部分   <script> <!-- function setTab(name,cursel,n){ for(i=1;i<=n;i++){ var menu=document.getElementById(name+i); var con=document.getElementById("con_"+name+"_"+i); menu.className=i==cursel?"hover":""; con.style.display=i==cursel?"block":"none"; } } //--> <...

    标签:

  • 如何解决wow.js与fullpage的兼容性

    2018年05月29日 | 作者: 影子 | 评论数:0

    如何解决wow.js与fullpage的兼容性
    项目需要做到全屏显示的同时还需要做到实时执行动画。但是发现在使用fullpage之后,wow.js不起作用。找了诸多资料,解决方法如下: $('#fullpage').fullpage({ verticalCentered:true, css3:true, paddingTop:70, anchors: ['page1', 'page2', 'page3], scrollBar: true, afterRender: function(){ wow = new ...

    标签:,

  • js返回上一页

    2018年05月09日 | 作者: 影子 | 评论数:0

    js返回上一页
    <a href="javascript:history.go(-1)">返回上一页</a> <a href="javascript:location.reload()">刷新当前页面</a> <a href="javascript:" onclick="history.go(-2); ">返回前两页</a> <a href="javascript:" onclick="self.location=document.referrer;">返回上一...

    标签:

  • js原生getElementsByClassName兼容IE7以上

    2017年03月09日 | 作者: 影子 | 评论数:0

    js原生getElementsByClassName兼容IE7以上
    客户的需求: 列表前两行后添加最新标签,兼容IE7以上及主流浏览器。   js部分 <script> function getElementsByClassName(className, root, tagName) { //root:父节点,tagName:该节点的标签名。 这两个参数均可有可无 if (root) { root = typeof root == "string" ? document.getElementById(r...

    标签: