boot:function(){
//加载页面时执行一次
changeMargin();
//监听浏览器宽度的改变
window.onresize = function(){
changeMargin();
};
function changeMargin(){
//获取元素距离屏幕左边的距离
var divLeft = $('.news').offset().left;
//获取网页可见区域宽度
var docWidth = document.body.clientWidth;
if(docWidth <= 1600){
//动态设置教师风采样式
$('.photoInside').css({
'margin-left':divLeft,
'width':'1150px'
});
}
}
}

JS实时监听浏览器宽度的变化的更多相关文章

  1. js 实时监听input中值变化

    注意:用到了jquery需要引入jquery.min.js. 需求: 1.每个地方需要分别打分,总分为100; 2.第一个打分总分为40; 3.第二个打分总分为60. 注意:需要判断null.&quo ...

  2. js实时监听input中值得变化

    <!DOCTYPE html> <html> <head> <title>zepto</title> <meta name=" ...

  3. oninput和onpropertychange实时监听输入框值的变化

    oninput和onpropertychange实时监听输入框值的变化 传统监听输入框的做法就是使用keyup.keydown.keypress,或者change事件来实现,但keyup.keydow ...

  4. javascript --- 实时监听输入框值的变化

    实时监听文本框值变化是非常常见的功能,通常最简单的办法就是用keyup,keydown来实现,但是这种方法有两个问题,一个是当直接复制粘贴的时候没法监听到事件,另外一个问题是在移动端,使用删除键删除输 ...

  5. Js/jQuery实时监听input输入框值变化

    前言在做web开发时候很多时候都需要即时监听输入框值的变化,以便作出即时动作去引导浏览者增强网站的用户体验感.而采用onchange时间又往往是在输入框失去焦点(onblur)时候触发,有时候并不能满 ...

  6. js实时监听dom尺寸变化

    开发过程中总会遇到dom节点尺寸变化,去做一些相应的逻辑,第一想到的应该是用$(window).resize()去做,但是这个是监听浏览器窗口的所以这个时候要用 ResizeObserver Resi ...

  7. 关于实时监听input的值得变化的问题

    onchange 关于input的onchange事件  其实是有出发条件的  并非实时监听的 1.鼠标点击事件  或者键盘事件(tab和wins键都可以触发  enter在ie9时不触发,火狐和ch ...

  8. 通过jQuery实时监听表格行数变化

    [本文出自天外归云的博客园] 使用bootstrap table组件,当使用过滤器的时候,页面的表格行数发生变化,此时需要统计表格行数.想要监听表格变化,如何做呢? 使用场景:有一个表格里放着许多测试 ...

  9. 使用jQuery实时监听input输入值的变化

    //jQuery实时监听input值变化 $("#email").on("input propertychange",function(){ var str = ...

随机推荐

  1. 圣诞福利到!51Testing邀你一起来狂欢!有礼就是任性~(≧▽≦)/~

    “我想变成一棵树,一棵只为你存在的圣诞树,顶上最大最亮的那颗星是我的真心,下面挂满我对你的祝福. 你的关注是我的幸福,你的肯定是我的力量,而我将用更多精彩的内容,用心的分享,给你下一个一整年的 精彩! ...

  2. DATE_FORMAT()(转)

    mysql中DATE_FORMAT(date, format)函数可根据format字符串格式化日期或日期和时间值date,返回结果串. 也可用DATE_FORMAT( ) 来格式化DATE 或DAT ...

  3. C# config配置文件 自定义节点读取

    主要使用:ConfigurationSection IConfigurationSectionHandler已被否决 http://technet.microsoft.com/zh-cn/librar ...

  4. QT5.1在Windows下 出现QApplication: No such file or directory 问题的解决办法

    QT5.0.1在Windows下 出现QApplication: No such file or directory 问题的解决办法 分类: 编程语言学习 软件使用 QT编程学习2013-03-07 ...

  5. [SAM4N学习笔记]SAM4N工程模板搭建

    一.需要安装的软件: 因为笔者是使用MDK-ARM开发的版本是4.72,所以需要安装这个工具,具体在哪里下载自行放狗或问度娘.除了这个重要工具以为,还需要安装Atmel官方的Atmel Studio, ...

  6. xml增强学习笔记

    2 Dom4j修改xml文档 2.1 写出内容到xml文档 XMLWriter writer = new XMLWriter(OutputStream, OutputForamt) wirter.wr ...

  7. 【设计模式 - 24】之访问者模式(Visitor)

    1      模式简介 访问者模式的定义: 访问者模式将数据结构与数据操作进行了分离,解决了稳定的数据结构和易变的数据操作的耦合问题. 访问者模式的优点: 1)        符合单一职责原则: 2) ...

  8. BZOJ 3265 志愿者招募增强版 单

    标题效果:同1061 只是间隔为每种类型的志愿工作是多级 这是卡网络流量?未知 所有在所有的1061您将可以更改为在稍微改变- - #include <cmath> #include &l ...

  9. android之TabWidget选项卡

    1 概览 l  TabWidget与TabHost.tab组件一般包括TabHost和TabWidget.FrameLayout,且TabWidget.FrameLayout属于TabHost. l  ...

  10. Linux TCP/IP parameters reference

    This is a reference of IP networking parameters that are configurable as described in our linux twea ...