• 今天主要内容回顾


    序言:今天又进行了这一周的面试,不同的是我是其中面试者之一。我觉得模拟面试真的是一个很好的体验,每一次面试都学到很多,和知道许多需要注意的点。

             其次今天讲了一个知识点,就是hammer.js,下面我就来详细说说今天又学到的面试技巧和hammer.js吧。

    一:面试技巧要素

    1:个人简历主要内容:

    A:姓名,电话,邮箱,

    B:自我介绍内容:占全片3分之一(记得一定要说自己性格活泼,善于交流哟)

    C:求职意向:一行

    D:工作经历:
         某某年某某月-某某年某某月:项目名称
         项目简单描述:该项目是一个怎样的项目,有哪些模块,用了哪些知识技能
         项目自己负责的部分:自己负责模块和用到的技能

    E:个人技能:(用于吹牛逼)

    a.精通HTML+ css,div+css布局,移动端的em,rem布局,HTML5+css布局,

    b.熟悉960GridSystem,bootstrap,less,sass等css框架,

    c.熟悉js,ECMAscript,了解ES6,同时也熟悉jquery,zepto,jquerymodile,hammer.js,require。js等js库,还能自己编写jquery插件,

    d.还熟悉node.js,express,jade等node.js库,

    e.以及php,MySQL,c语言等后台语言....

    2.自我介绍:不快不慢不慌,井井有条,有底气自信,多说重点,多讲项目,让你来引导面试官,说话气从丹田里出

    3.姿态:坐姿端正,不勾腰驼背,手别乱摸,也别乱放,眼神不要飘,直视面试官,面带微笑

    二:hammer.js知识点:

    效果:实现图片的来回滑动轮播过程

    1:HTML代码:

    <div id="imgs">
    <ul id="show">
    <li><img src="img/01.jpg"/></li>
    <li><img src="img/02.jpg"/></li>
    <li><img src="img/03.jpg"/></li>
    <li><img src="img/04.jpg"/></li>
    </ul>
    </div>

    2.css代码:

    <style>
    *{
    margin:0;
    padding:0;
    }
    div{
    660px;
    height:380px;
    position: relative;
    margin:50px auto;
    overflow:hidden;
    border:5px solid #000;
    box-shadow:0 0 5px ;
    }
    #imgs ul{
    400%;
    height:380px;
    position:absolute;
    left:0;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -ms-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;

    }
    #imgs ul li{
    list-style:none;
    660px;
    float:left;
    transition:all 0.5s linear;
    }

    3.hammer.js代码:

    js原生方法:

    引用<script src="js/hammer.js"></script>插件

    var show=document.getElementById('show');
    var mc=new Hammer(show);
    mc.on('pan',function(e){
    if(e.distance>=400){
     show.style.left="-660px";
    } else if(e.distance<400){
    show.style.left= e.distance+"px";
    }
    if(e.distance<400){
     show.style.left="0px";
    }
    })

    jquery方法:

    引用

    <script src="js/jquery-2.1.4.js"></script>
    <script src="js/hammer.js"></script>
    <script src="js/jquery.hammer.js"></script>

    插件

    $('#show').hammer().bind('pan',function(ev){
    var e=ev.gesture;
    if(e.distance>=320){
    show.style.left="-660px";
    } else if(e.distance<400){
    show.style.left= e.distance+"px";
    }
    if(e.distance<400){
    show.style.left="0px";
    }
    })

  • 相关阅读:
    算法总结--排序(快排未写)
    关于我,至目前的总结与展望
    二 python之数据类型和字符编码
    三 python之文件处理
    一 python编程基础
    markdown语法
    规模-复杂世界的简单法则---熵
    块级元素display:inline-block 在IE6 IE7无效
    CSS3 文本超出后显示省略号...
    让nodejs在iis上运行
  • 原文地址:https://www.cnblogs.com/lumeiling/p/5087486.html
Copyright © 2020-2023  润新知