昨天遇到一用js改变元素浮动的,当时直接写了 obj.style.float="left";结果没起作用;查了资料后才发现不能这样写,现在整理下几种样式写法

1,直接写css属性的,如:obj.style.height/width/color/position等

2,要改大写的,如:obj.style.fontSize/marginLeft/backgroundColor等

3,float,此属性在IE中用obj.style.styleFloat="left";

        在ff等其他浏览器中用obj.style.cssFloat="left";

第三中兼容性写法:obj.style['cssFloat' in obj.style?'cssFloat':'styleFloat']='left';具体例子如下

 <style type="text/css">
#content{
width: 1000px;
margin: 0 auto;
background: #66c;
overflow: hidden;
}
#left{
width: 200px;
height: 50px;
background: #c66;
color: #fff;
}
</style>
    <div id="content">
<div id="left">left</div>
<div id="main">main</div>
</div>
     <script type="text/javascript">
  var oLeft=document.getElementById('left');
  oLeft.style['cssFloat' in oLeft.style?'cssFloat':'styleFloat']='left';
</script>

这样就通过js改变了id为left的float属性

javascript改变样式(cssFloat,styleFloat)的更多相关文章

  1. 5.JavaScript改变样式,验证用户输入

    ① x=document.getElementById("demo") //找到元素 x.style.color="#ff0000"; //改变样式 ② if ...

  2. javascript和jquery 移除事件 和 改变样式

    javascript移除事件: document.getElementById("word").onmouseover = null; javascript改变样式: docume ...

  3. web appbuilder 改变样式和添加自定义widget

    一.改变样式 要实现的效果是添加cyan样式 1.将FoldableTheme/style下的cyan copy到TabTheme下的同一目录下: 2.打开TabTheme下的manifest,cop ...

  4. 标签(改变样式style)

    id可以换为class,class对应的名字可以多个一样 <div class="box">box1</div> <div class="b ...

  5. ng-repeat动态改变样式

    当我们使用AngularJs的ng-repeat时候动态绑定数据时,遇到遍历出来的标签样式都一样,这时候希望根据数组的下标分别对应不同的样式 解决:使用$index获取数组下标根据下标改变样式 < ...

  6. 自己定义RatingBar,能依据设置改变样式

    项目在我的GITHUB上  mirsfang的GitHub 一个简单的自己定义View  ,为了一个 比較奇葩的需求而搞出来的.他的功能就是能让你自己设置图片和图片的大小以及星星的数量,是一个组合型的 ...

  7. 微信小程序,动态改变样式

    小程序目前没有修改样式api,但是可以利用数据绑定实现动态改变样式,可以用view标签模拟page然后改变view标签的样式,以下案例演示了如果改变page背景颜色: <view class=& ...

  8. 客户端的javascript改变了asp.net webform页面控件的值,后台代码中如何获取修改后的值。

    客户端的javascript改变了asp.net webform页面控件的值,后台代码中如何获取修改后的值.     无论是什么的html控件,只要加上了runat="server" ...

  9. vue点击时动态改变样式 ------- 最简单的方法

    vue点击时动态改变样式 template中 <li :class="{ active:index==isActive }" @click="changeValue ...

随机推荐

  1. Android开发--环境的配置

    一 Android开发环境:JDK.eclipse ADT.海马模拟器或者夜神模拟器.配置之前先保证运行内存足够大,不然会导致运行卡. 二 JDK(不用安装) 1.jdk官方下载地址:http://w ...

  2. JAVA的Date类与Calendar类【转】

    Date类 在JDK1.0中,Date类是唯一的一个代表时间的类,但是由于Date类不便于实现国际化,所以从JDK1.1版本开始,推荐使用Calendar类进行时间和日期处理.这里简单介绍一下Date ...

  3. C++ 类里面,函数占用存储空间问题

    转载自:http://blog.163.com/xping_lsr/blog/static/19654034520119804131721/ 先看两段代码: 代码段1:class A{public:i ...

  4. 移动前端头部标签(HTML5 meta)

    在移动前端开发中添加一些webkit专属的HTML5头部标签,帮助浏览器更好解析html代码 <!DOCTYPE html>  使用 HTML5 doctype,不区分大小写 <he ...

  5. solr 5.5.1安装并配置中文分词IKAnalyzer

    http://www.360doc.com/content/16/0623/17/5131531_570184594.shtml ——————————————————————————————————— ...

  6. SQL常用代码收集

    1.存储过程中,使用in查询时的参数处理方式 使用情形描述:传入存储过程的参数为一个字符串@IDs,以固定分隔符连接 新建字符串分割函数,然后将分割结果传入存储过程: CREATE FUNCTION ...

  7. UBUNTU9.10下安装TFTP学习笔记一(arm学习SEED-138板子)

    擦,刚刚写的没保存都丢了,郁闷中~~~~ 简单重写 1什么是TFTP .安装TFTP(TFTP(Trivial File Transfer Protocol,简单文件传输协议)是TCP/IP协议族中的 ...

  8. asp.net mvc 如何将controller 里一个action 返回值为list<>的值输出到view

    在controller中:return View(myRole.ToList());在view文件开头加上:@model IEnumerable<LTXYCallCenter.Models.Ro ...

  9. A configuration with this name already exists

    进入eclipse的workspace下的目录workspace\.metadata\.plugins\org.eclipse.debug.core\.launches,如实际目录为: D:\work ...

  10. linux关闭防火墙

    查看防火墙状态: sudo service iptables status linux关闭防火墙命令: sudo service iptables stop linux启动防火墙命令: sudo se ...