Div样式查看器
编写div属性时,经常需要尝试不同的样式,可以用Javascript写一个简单的div样式查看器,方便日常操作:

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>div样式查看器</title>
<style>
#div1{
height: 200px;
width: 200px;
background: gray;
}
</style>
<script>
function change(){
var style=document.getElementById("style").value;
var param=document.getElementById("param").value;
var value=document.getElementById("value").value;
alter(style,param,value);
}
function alter(style,param,value){
var div1=document.getElementById("div1");
if(style!="")
{
div1[style][param]=value;
}
else
{
div1[param]=value;
}
}
</script>
</head>
<body>
style:<input type="text" id="style"><br>
param:<input type="text" id="param"><br>
value:<input type="text" id="value"><br>
<input type="button" value="change" onclick="change()"/>
<div id="div1"></div>
</body>
</html>
Div样式查看器的更多相关文章
- 发布两款JQ小插件(图片查看器 + 分类选择器),开源
图片查看器,github地址:https://github.com/VaJoy/imgViewer 效果如下: 这款当初大概写了2小时,有点匆忙地赶出来的,使用的接口很简单: $.bindViewer ...
- 用JQ仿造礼德财富网的图片查看器
现在就职于一家P2P平台,自然也会关注同行其它网站的前端技术,今天要仿造的是礼德内页的一个图片查看器效果.不过说白了,无论人人贷也好礼德财富也好,很多地方的前端都做的不尽如人意,比如忽略细节.缺乏交互 ...
- 基于jQuery的一个简单的图片查看器
项目中自己diy了一个图片查看器.因为初始代码不是自己的,只是在上面改了一下也没有弄的很漂亮.等以后有时间了在重写一下样式和封装,作为备用的只是积累吧.如果有童鞋有用到,完全可以在此基础上改,比较容易 ...
- js手写图片查看器(图片的缩放、旋转、拖拽)
在做一次代码编辑任务中,要查看图片器.在时间允许的条件下,放弃了已经封装好的图片jq插件,现在自己手写js实现图片的缩放.旋转.推拽功能! 具体代码如下: <!DOCTYPE html> ...
- js实现图片查看器(图片的缩放、旋转、拖拽)
一.关于图片查看器. 目前网络上能找到的图片查看器很多,谁便一搜就能出来.如:jquery.iviewer.js.Viewer.js这两个js文件,其中功能也足够满足大部分开发需求.但是单纯的就想实现 ...
- 网页中的图片查看器viewjs使用
需求分析: 对于网页中的图片进行连续放大(便于用户清晰查看内容).缩小,旋转等操作,可以使用viewjs图片查看器插件实现. viewjs官方网址:https://github.com/fengyua ...
- angularjs1 自定义图片查看器(可旋转、放大、缩小、拖拽)
笔记: angularjs1 制作自定义图片查看器(可旋转.放大.缩小.拖拽) 2018-01-12 更新 可以在我的博客 查看我 已经封装好的 纯 js写的图片查看器插件 博客链接 懒得把 ...
- 图像处理工具包ImagXpress中如何定义查看器的属性
想要在图像处理控件ImagXpress中查看一个图像,首先需要创建一个查看器,之后你可以按照你自身的需要,来定义查看器的属性. 创建查看器 想要动态的创建一个查看器,需要先定义一个新的mageXVie ...
- 转: Windows如何打开和使用事件查看器管理计算机
方法/步骤 1 右键单击"我的电脑"(win8中名称为"这台电脑.This Computer"),选择"管理",点击. 步骤阅读 2 出 ...
随机推荐
- STORM_0004_windows下zookeeper的伪集群的搭建
-----------------------------------------------------START------------------------------------------ ...
- Codeforces Round #272 (Div. 2) C. Dreamoon and Sums 数学
C. Dreamoon and Sums time limit per test 1.5 seconds memory limit per test 256 megabytes input stand ...
- 常用的邮箱服务器(SMTP、POP3)地址、端口
常用的邮箱服务器(SMTP.POP3)地址.端口 参考网址:http://wenku.baidu.com/link?url=IPv15rPRkd0nsuGH0Dm0A5kFyRaeHJY2_gYpDW ...
- Redis基础知识之————使用技巧(持续更新中.....)
一.key 设计技巧 把表名转换为key前缀 如, tag: 第2段放置用于区分区key的字段--对应mysql中的主键的列名,如userid 第3段放置主键值,如2,3,4...., a , b , ...
- js简介、基本语法、类型转换、变量、运算符、分支语句、循环语句、函数、函数调用
javascript是个脚本语言,需要有宿主文件,他的宿主文件是html文件. 三个常用对话框 alert("")警告对话框,弹出一个警告对话框 <script> al ...
- Tomcat的使用
Tomcat的安装较为简单,尤其是Tomcat的安装文件apache-tomcat-7.0.19-windows-x86.zip,直接解压至目标目录下即可. Tomcat的安装目录下包括bin.con ...
- Java编程思想学习笔记_3(继承,内部类)
一.继承与清理 如果某个类需要去清理自身的资源,那么必须用心为其创建回收垃圾的方法,而如果此类有导出的子类,那么必须在导出类中覆盖回收的方法,当覆盖被继承类的回收垃圾的方法的时候,需要注意销毁的顺序应 ...
- Bootstrap强调相关的类
在Bootstrap中除了使用标签<strong>.<em>等说明正文某些字词.句子的重要性,Bootstrap还定义了一套类名,这里称其为强调类名(类似前面说的“.lead” ...
- 【matlab】读写文件
save('pqfile.mat','M'); ('E:\我的坚果云\pqfile.mat','M'); 其他: http://blog.csdn.net/iqizheng/article/detai ...
- phalcon: tasks MainTask.php命令行工具
phalcon: tasks MainTask.php命令行工具 tasks MainTask.php 一般用来做计划任务,处理比较复杂的大型的数据.然后其他功能或程序才能更简单的读取这些复杂的数据. ...