软件开发培训班 >> 编程开发 >> JavaScript

javascript线性渐变一

　　本文标签：javascript,线性渐变

<!doctype html> 
<title>javascript线性渐变 by 司徒正美</title> 
<meta charset="utf-8"/> 
<meta name="keywords" content="javascript线性渐变 by 司徒正美" /> 
<meta name="description" content="javascript线性渐变 by 司徒正美" /> 
<style type="text/css"> 
#gradient{ 
height:120px; 
color:navy; 
filter:progid:DXImageTransform.Microsoft.gradient(enabled=false,gradientType=1,startColorstr=#ffff0000, endColorstr=#00ffffff); 
} 
</style> 
<script type="text/javascript"> 
window.onload = function(){ 
var div = document.getElementById("gradient"), 
button = document.getElementById("toggle"), 
filter = div.filters[0]; 
//因为它只应用到一个滤镜 。由此也可见，filters是作为元素对象的一个属性而存在， 
//此属性是一个集合，里面是静态CSS定义过的滤镜与动态添加过的滤镜 。 
//如果不止一个滤镜，我就要使用如下方式取得相应的滤镜对象 
//filter = div.filters["DXImageTransform.Microsoft.Gradient"] 
filter = div.filters.item("DXImageTransform.Microsoft.Gradient") 
button.onclick = function(){ 
if(filter.enabled){ 
filter.enabled = "false"; 
div.style.color = "navy"; 
button.innerHTML = "启用滤镜"; 
}else{ 
filter.enabled = "true"; 
div.style.color = "#000"; 
button.innerHTML = "禁用滤镜"; 
} 
} 
} 
</script> 
<div id="gradient">javascript线性渐变 by 司徒正美</div> 
<button type="button" id="toggle">启用IE滤镜</button>

技术文章快速查找

jquery中的 $("#jb51")与document.getElementById("jb51") 的区别

Ubuntu中搭建Nodejs开发环境过程分享

jQuery库与其他JS库冲突的解决办法

document.onreadystatechange事件的用法分析

ASP.NET jQuery 实例4(复制TextBox的文本到本地剪贴板上)

javascript 封装的一个实用的焦点图切换效果

Uglifyjs(JS代码优化工具)入门安装使用

JS正则验证邮箱的格式详细介绍

相关下载

在线教程导航

软件应用
·Windows8	·Windows7	·Word
·Excel	·PPT	·WPS
Web开发
·ASP	·JavaScript	·DIV+CSS
·JSP	·VbScript	·XML
·PHP
开发语言
·VB	·VC	·ASP.NET
·Java	·C++	·Delphi
数据库开发
·MySQL	·MsSQL	·Access
·Oracle	·DB2
手机系统
·Android	·iOS	·WindowsPhone
网站设计
·Flash	·Dreamweaver	·Fireworks
平面设计
·Photoshop	·CorelDraw	·AutoCAD
·3DsMAX	·Illustrator
网络技术
·网站运营	·网络安全	·网络搭建