zoukankan      html  css  js  c++  java
  • 从小白到工作中陆陆续续积攒的小知识点,可以给新手收藏。

     更新中。。。

    1,在做下拉菜单时,为了带一些下拉效果,可以直接利用jQuery自带的slideUp和slideDown来进行设计,还有一种控制就是slideToggle.

      如:$(".downlist").slideToggle();可以进行下拉与收起的动效。

      有些时候下拉菜单的标题内会带有小三角标来标识下拉与收起,就涉及到了三角标的transform,可以把切换写在function内。

      如:

    $(".left .list-down").click(function () {
        $(this).find(".downlist").slideToggle(function () {
          if($(this).is(":hidden")){
            $(this).parent().find("span.san").css("transform","rotate(0)");
          }else{$(this).parent().find("span.san").css("transform","rotate(180deg)");}
        });
    
      })

    2,PC与移动端自适应切换 

    function browserRedirect() {
      var sUserAgent= navigator.userAgent.toLowerCase();
      var bIsIpad= sUserAgent.match(/ipad/i) == "ipad";
      var bIsIphoneOs= sUserAgent.match(/iphone os/i) == "iphone os";
      var bIsMidp= sUserAgent.match(/midp/i) == "midp";
      var bIsUc7= sUserAgent.match(/rv:1.2.3.4/i) == "rv:1.2.3.4";
      var bIsUc= sUserAgent.match(/ucweb/i) == "ucweb";
      var bIsAndroid= sUserAgent.match(/android/i) == "android";
      var bIsCE= sUserAgent.match(/windows ce/i) == "windows ce";
      var bIsWM= sUserAgent.match(/windows mobile/i) == "windows mobile";
      if (bIsIpad || bIsIphoneOs || bIsMidp || bIsUc7 || bIsUc || bIsAndroid || bIsCE || bIsWM) {
        window.location.href= 'http://www.ezhanlu.com/mobile/mhome.html';
        }
      }
      browserRedirect();

    //或者更简单的
    function isMobileUserAgent(){
      return (/iphone|ipod|android.*mobile|windows.*phone|blackberry.*mobile/i.test(window.navigator.userAgent.toLowerCase()));
    }
    if(isMobileUserAgent()){
      window.location.href = "http://m.qidian.qq.com" + window.location.pathname + window.location.search;
    }

    3.点击直接进行qq对话

    <a href="http://wpa.qq.com/msgrd?V=1&uin=QQ号&exe=qq&Site=qq&menu=yes" target="qidian">
      <div class="list" id="callChat">
        <img src="../../assets/images/fixed_QQ.png" alt="">
        <p>QQ咨询</p>
      </div>
    </a>
    <iframe width="" height="" name="qidian" style="display:none;"></iframe> //一个空的iframe来接收点击之后跳转的页面,来使点击直接提示qq聊天,而不跳转页面
  • 相关阅读:
    div居中鼠标悬浮显示下拉列表
    javascript循环
    javascript函数
    javascript时间、随机数
    javascript外部使用
    Javascript 探路
    CSS六大选择器(注释css表里不能加注释!!)
    框架链接
    Jmeter分布式测试dubbo接口2
    Jmeter分布式测试dubbo接口1
  • 原文地址:https://www.cnblogs.com/aburron/p/6081150.html
Copyright © 2011-2022 走看看