<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD><TITLE>Filters and Transitions Interactive Demo</TITLE>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
<STYLE>IMG {
BORDER-RIGHT: black 2px solid; BORDER-TOP: black 2px solid; BORDER-LEFT: black 2px solid; BORDER-BOTTOM: black 2px solid
}
BODY {
FONT-SIZE: 80%; BACKGROUND: white; MARGIN: 0px; FONT-FAMILY: verdana
}
.bar {
BORDER-TOP: #99ccff 1px solid; BACKGROUND: #336699; WIDTH: 100%; BORDER-BOTTOM: #000000 1px solid; HEIGHT: 30px
}
.desbar {
PADDING-RIGHT: 10px; BORDER-TOP: #cccccc 1px solid; PADDING-LEFT: 10px; FONT-SIZE: 8pt; BACKGROUND: #ffffff; PADDING-BOTTOM: 10px; WIDTH: 100%; COLOR: black; PADDING-TOP: 10px; BORDER-BOTTOM: #000000 1px solid
}
.title {
PADDING-LEFT: 10px; FONT-SIZE: 15pt; COLOR: white
}
PRE {
MARGIN: 0px
}
A:link {
COLOR: white; TEXT-DECORATION: none
}
A:visited {
COLOR: white; TEXT-DECORATION: none
}
A:active {
COLOR: white; TEXT-DECORATION: none
}
A:hover {
COLOR: yellow; TEXT-DECORATION: none
}
SELECT {
BORDER-RIGHT: 2px; BORDER-TOP: 2px; FONT-SIZE: 9pt; BORDER-LEFT: 2px; BORDER-BOTTOM: 2px
}
</STYLE>
<SCRIPT language=javascript>
var browserCapable = true; // Prevents errors on downlevel browsers
var startImage = "fruit.gif"; // /workshop/graphics/
var endImage = "mouse.gif";
var featuresHeader = "<B>Features:</B><BR>"
var sSinQut ="'";
var sRandomBarsOrientationText="";
function copy2Clipboard()
{
// Copy displayed code to user's clipboard.
var textRange = document.body.createTextRange();
textRange.moveToElementText(oCodeSpan);
textRange.execCommand("Copy");
}
function highlightText(whatToHighlight) {
var oRng = document.body.createTextRange();
oRng.moveToElementText(oCodePre);
oRng.execCommand("RemoveFormat");
var oHL = document.body.createTextRange();
oHL.moveToElementText(oCodePre);
oHL.findText(whatToHighlight);
oHL.execCommand("Bold");
}
function switchContent(obj) {
oContentHolder.innerHTML=obj.innerHTML;
oImg.src=startImage;
if (obj==filterSection){
changeFilter();
updateFilterCode();
}
else {
imgObjText.innerHTML = "<BR><b>First Page</b><BR><BR>Using the <B>apply</B> method prepares this SPAN element for content changes.";
changeTrans();
updateTransCode();
}
}
function getControlObject(controlName) {
var obj=null;
for (x=0; x < document.all(controlName).length; x++) {
objTemp = document.all(controlName,x);
if (objTemp.parentElement.isSource==null) {
obj=objTemp;
}
}
return(obj);
}
function disableControlObject(controlName) {
for (x=0; x < document.all(controlName).length; x++) {
document.all(controlName,x).disabled=true;
}
}
function enableControlObject(controlName) {
for (x=0; x < document.all(controlName).length; x++) {
document.all(controlName,x).disabled=false;
}
}
function changeFilter() {
var selectObject = getControlObject("oSelect");
var selectedValue = selectObject.options[selectObject.selectedIndex].value;
var transitionAsFilter = selectObject.options[selectObject.selectedIndex].TRANS;
imgObjText.innerHTML = "<BR>The image, dark red text, and sky blue background make up the content of the filtered SPAN.";
imgObj.style.backgroundColor='skyblue';
imgObj.style.color='darkred';
if (selectedValue != "empty") {
if (selectedValue.indexOf('AlphaImageLoader')!=-1) {
oControlsSpan.innerHTML = oAlphaImageLoaderControls.innerHTML;
alphaImageLoaderFilterChange();
}
else if (selectedValue.indexOf('Alpha')!=-1) {
oControlsSpan.innerHTML = oAlphaControls.innerHTML;
alphaFilterChange();
}
else if (selectedValue.indexOf('Emboss')!=-1) {
oControlsSpan.innerHTML = "";
embossFilterChange();
}
else if (selectedValue.indexOf('Engrave')!=-1) {
oControlsSpan.innerHTML = "";
engraveFilterChange();
}
else if (selectedValue.indexOf('Pixelate')!=-1) {
oControlsSpan.innerHTML = oPixelateFilterControls.innerHTML;
pixelateFilterChange();
}
else if (selectedValue.indexOf('DropShadow')!=-1) {
imgObj.style.backgroundColor='';
imgObjText.innerHTML = "<BR>The image, dark red text, and sky blue background make up the content of the filtered SPAN.";
oControlsSpan.innerHTML = oDropShadowControls.innerHTML;
dropShadowFilterChange();
}
else if (selectedValue.indexOf('Chroma')!=-1) {
oControlsSpan.innerHTML = oChromaControls.innerHTML;
chromaFilterChange();
}
else if (selectedValue.indexOf('BasicImage')!=-1) {
oControlsSpan.innerHTML = oBasicImageControls.innerHTML;
basicImageFilterChange();
}
else if (selectedValue.indexOf('Gradient')!=-1) {
oControlsSpan.innerHTML = oGradientControls.innerHTML;
gradientFilterChange();
}
else if (selectedValue.indexOf('Glow')!=-1) {
oControlsSpan.innerHTML = oGlowControls.innerHTML;
glowFilterChange();
}
else if (selectedValue.indexOf('MotionBlur')!=-1) {
oControlsSpan.innerHTML = oMotionBlurControls.innerHTML;
motionBlurFilterChange();
}
else if (selectedValue.indexOf('Shadow')!=-1) {
oControlsSpan.innerHTML = oShadowControls.innerHTML;
shadowFilterChange();
}
else if (selectedValue.indexOf('Wave')!=-1) {
oControlsSpan.innerHTML = oWaveControls.innerHTML;
waveFilterChange();
}
else if (selectedValue.indexOf('Blur')!=-1) {
imgObj.style.backgroundColor='';
imgObjText.innerHTML = "<BR>The image, dark red text, and sky blue background make up the content of the filtered SPAN.";
oControlsSpan.innerHTML = oBlurControls.innerHTML;
blurFilterChange();
}
else {
imgObj.style.filter=selectedValue;
oControlsSpan.innerHTML = '';
}
if (oControlsSpan.innerHTML!='') {
oControlsSpan.innerHTML = featuresHeader + oControlsSpan.innerHTML;
}
if (transitionAsFilter == "TRUE") {
oControlsSpan.innerHTML = oControlsSpan.innerHTML + oGlobalControls.innerHTML;
progressChange();
}
}
else {
imgObj.style.filter='';
oControlsSpan.innerHTML = featuresHeader + 'No filter is currently selected.';
}
updateFilterCode();
}
function updateFilterCode() {
oCodePre.innerText=imgObj.outerHTML;
}
function waveFilterChange(){
var cmd;
var controlObject = getControlObject("WaveFreqList");
var freq = controlObject.options[controlObject.selectedIndex].value;
controlObject = getControlObject("WaveLightStrengthList");
var lightStrength = controlObject.options[controlObject.selectedIndex].value;
controlObject = getControlObject("WavePhaseList");
var phase = controlObject.options[controlObject.selectedIndex].value;
controlObject = getControlObject("WaveStrengthList");
var strength = controlObject.options[controlObject.selectedIndex].value;
cmd = "imgObj.style.filter='progid:DXImageTransform.Microsoft.Wave(" ;
cmd = cmd + "freq=" + freq;
cmd = cmd + ",LightStrength=" + lightStrength;
cmd = cmd + ",Phase=" + phase;
cmd = cmd + ",Strength=" + strength;
cmd = cmd + ")'";
eval(cmd);
updateFilterCode();
highlightText(cmd);
}
function shadowFilterChange(){
var cmd;
var controlObject = getControlObjec
收集的css滤镜都开源代码免资源分
5星 · 超过95%的资源 需积分: 9 64 浏览量
2008-08-29
11:56:27
上传
评论
收藏 308KB RAR 举报 
滤镜.rar （42个子文件） 
滤镜 
css滤镜.chm 188KB 微软滤镜调配器 
mouse.gif 2KB fruit.gif 3KB Filters and Transitions Interactive Demo.htm 56KB IASample.css 622B CSS滤镜全接触 08.htm 5KB 12.htm 8KB 09.htm 5KB 06.htm 5KB 04.htm 4KB 11.htm 6KB 05.htm 5KB 14.htm 9KB images datatop.gif 5KB
rose.jpg 13KB radar.jpg 9KB cloud.gif 14KB edie.css 346B 13.htm 6KB index.htm 9KB 07.htm 4KB 10.htm 5KB 02.htm 5KB 15.htm 8KB 03.htm 5KB CSS滤镜实例 Gray.htm 1KB DropShadow.htm 2KB Mask.htm 2KB FlipV.htm 1KB Shadow.htm 2KB blur.htm 2KB Invert.htm 1KB EG.jpg 32KB Glow.htm 2KB Light.htm 2KB Alpha.htm 2KB Grayscale.htm 1KB index.htm 3KB Chroma.htm 1KB FlipH.htm 1KB Wave.htm 2KB Xray.htm 2KB资源评论
yunyuan09342012-11-06很好用，每个滤镜的参数介绍的都很全面- a1159202012-08-17非常不错，而且免费
friren
- 粉丝: 3
- 资源: 13
最新资源
- 黑苹果OC引导-0.9.1
- Redis 服务等过期策略和内存淘汰策略解析
- debian配置FTP服务
- 基于Matlab和CPLEX的2变量机组组合调度程序(注释完全，可直接运行)(文档加Matlab源码)
- 基于TMS320F2812设计复合频率信号频率计AD09硬件（原理图+PCB )+CCS软件源码+详细设计文档资料.zip
- MultivariateAnalysis（目标规划、多元分析与插值的相关例子）(注释完全，可直接运行)(文档加Matlab源码)
- 黑苹果OC引导-0.9.2
- 数据库实验-王珊.doc
- unity读取excel工具 使用3.5即可
- Matplotlib 是一个 Python 的绘图库 Matplotlib 绘图指南与功能介绍.docx
资源上传下载、课程学习等过程中有任何疑问或建议，欢迎提出宝贵意见哦~我们会及时处理！
点击此处反馈
