zoukankan      html  css  js  c++  java
  • 监听浏览器宽度动态移动元素位置

    		 //用于在IT浏览兼容不同的浏览器
                    addEvent:  function(element, type, handler) {
    
    			if (element.addEventListener) {
    	  			element.addEventListener(type, handler, false);
    			} else if (element.attachEvent) {
    	  			element.attachEvent('on' + type, function() {
    	    			handler.call(element);
    	  			});
    			} else {
    	  			element['on' + type] = handler;
    			}
    		},                    
    

      动态的计算元素的节点位置变化

     

        <div class="list" :style="{ $index == activeIndex ? listWidth : '0px'}">  //listWidth:动态改变得位置变量,activeIndex:激活对应的Index,
                    <h5 class="label" v-text="service.label"></h5>
                    <p class="remark" v-text="$index == activeIndex ? service.remark : service.key"></p>
                    <ul>
                        <li v-for="item in service.children">
                            <span v-text="item.label"></span>
                        </li>
                    </ul>
                </div>
    	getWidth: function() {
    			this.listWidth = parseInt(this.$el.offsetWidth - 140 * 4) + 10 + 'px';//根据需要计算移动的宽度位置
    		}
            //在mounted里面调用此方法          this.getWidth(); this.addEvent(window, 'resize', this.getWidth);

      

  • 相关阅读:
    java 数字加密
    java 计算旅途时间
    java练习题3
    java练习题
    java练习
    java练习题
    删除记录模块的设计与实现
    修改记录模块的设计与实现
    提交页面
    采用PreparedStatement的对象实现记录的查询操作
  • 原文地址:https://www.cnblogs.com/wangliko/p/12068627.html
Copyright © 2011-2022 走看看