简单几个脚本和熟悉设置,让你的网页动起来。
1,文本框焦点
效果:获得焦点的时候有一段提示文字,没有获得焦点的时候为空。
代码:
<input type="text" value="请输入密码" onblur="if(value=='请输入密码'){value=''}" onfocus="if(value==''){value='请输入密码'}"/>
2. 鼠标移近移出
效果:靠近颜色或者图片发生变化,离开也是。
代码:
<input type="button" value="确定" onmouseout="this.style.color='blue'" onmouseover="this.style.color='red'"/>
3.使文字上下移动
效果:如同标题
代码:
<marqueue direction="up" srollamount="1" scrolldelay="1000" onmouseover="this.stop()" onmouseout="this.start()">我爱博客园!</marqueue>
4.状态栏上显示信息
效果:如同标题
备注:确保浏览器的状态栏打开。
代码:
<input type="button" value="我的状态可以显示在状态栏" onclick="window.status='我的状态可以显示在状态栏';return true;"/>
5.点击文字实现radio选项
效果:如同标题
代码:
<input type="radio" id="A1" name="sex"/><label for="A1">花木兰</label>
<input type="radio" id="A2" name="sex"/><label for="A2">卢俊义</label>
6.font的点击事件
效果:点击文字,触发事件。
代码:
<font onclick="alert('纯爷们,你点了我!')">敢点我吗?</font>
7.打印网页
效果:打开打印对话框
代码:
<input type="button" value="打印这些货" onclick="window.print()">
8.显示文档的最后修改日期
效果:如标题
代码:
<script type="text/javascript">
function showModifyDate()
{ alert(document.lastModified); }
</script>
<input type="button" value="显示最后修改日期" onclick="showModifyDate()">
9.根据选项改变背景
效果:如标题
代码:
<script type="text/javascript">
function bgchange(obj)
{ newColor=obj.options[obj.selectedIndex].text ;
document.bgcolor=newColor;
}
</script>
<select onchange="bgchange(this)">
<option>Red</option>
<option>blue</option>
</select>
10.刷新,前进,后退,全屏显示,转移到目标url
效果:如标题
代码:
<input type="button" value="刷新" onclick="history.go(0)"/>
<input type="button" value="前进" onclick="history.go(1)"/>
<input type="button" value="后退" onclick="history.go(-1)"/>
<input type="button" value="全屏" onclick="window.open(document.location,'url','fullscreen')"/>
<input type="button" value="跳转" onclick="javascript:window.location='目标地址'"/>
11.实时显示时间
效果:页面中动态显示时间
代码:
<script type="text/javascript">
window.onload= function()
{ setInterval("document.form1.textlock.value=(new Date);",1000);
}
</script>
<textarea id="textlock" rows=5 cols=40></textarea>
12.设为首页
<a onclick="this.style.behavior='url(#default#homepage)';this.setHomePage('http://www.sc-lyjs.com/');" target="" >设为首页</a>
13.增加到收藏夹
<script>
function addfavorite()
{
var title="博客园";//加入收藏的标题
var url="http://www.cnblogs.com/";//加入收藏的URL
var desc="博客园";
if (window.sidebar)
{
window.sidebar.addPanel(title, url,desc); //判断为火狐浏览器
}
else if( document.all )
{ //判断为IE浏览器
window.external.AddFavorite( url, title);
}
else if( window.opera && window.print )
{ //not support Now
return true;
}
}
</script>
<a onclick="addfavorite()" target="">加入收藏</a>
分享到:
相关推荐
都是常用的一些JS,chm格式。里面的效果和源码正是你想要的。
包含特效实例,可以看是否是自己想要的效果,可直接复制代码进行参考。
txt文件,荟萃了javascript很多的效果跟应用,适用新手学习,老手参考。
JavaScript大全 常用JS效果代码,绝对物超所值
此文档收集了HTML各种效果. 大多数源码都是经过测试过的,有需要者请放心使用.
javascript效果大全 js js效果 javascript效果
常用图片切换,有透明效果,在网上下载然后改动了一下
该资源中包含了javascript的常见效果演示示例,可以参照代码自己练习。其中的效果有动态下拉列表框、动态添加表格行、震动效果广告、树形菜单等等,有很多。效果都很震撼且很经典,很值得下载。
包含了js常用的效果集合,例如各种日历插件图片处理特效,抽奖代码等等各类常用功能,欢迎下载
常用Javascript特效代码集锦,带有演示,左侧是特效分类及名称,点击后在右侧窗口中可预览效果,点右键可查看源代码,非常方便,是网页编程及学习JS的好资料。这些特效涵盖图片特效、页面与背景特效、日期与...
程序员常用JavaScript特效源码,有很多很漂亮的特效哦!已编译成chm格式,里面有很多小实例,可以直接看到运行效果。
编辑整理的1500个前端开发常用JavaScript特效chm,包括了菜单效果、按钮效果、鼠标效果、页面效果、字符排版、计算、小游戏等的网页特效集,都是些较简单的JS特效。
_程序员常用JavaScript特效,对于页面的特殊效果开发很好
JavaScript效果,介绍了一些常用的JavaScript效果的实例应用。
程序员常用JavaScript特效.chm 可以 在CHM 里 看到效果
里面是一些我平常收集的一些javascript特奖,包括菜单伸缩、切换、级联、图片的展示等等。
一些常用的Javascript特效,一些很酷的javascript效果的实现
网页常用Javascript 1.让文字不停地滚动 2.记录并显示网页的最后修改时间 3.关闭当前窗口 4.5秒后关闭当前页 5.2秒后载入指定网页 6.添加到收藏夹 7.让超链接不显示下划线 8.禁止鼠标右键的动作 9....