这个特效非常简单,其中眼球和眼珠都是特定的图片.只要掌握好距离坐标就没问题.我就直接贴代码,有兴趣的朋友可以自己复制下来运行一下,下面的眼睛图像就是我的文件用到的图像,比较难看..我就把我的代码贴出来好了. 其中的html文件如下: <!DOCTYPE html> <html> <head> <title>eye</title> <script src="eye.js" type="text/javascrip…
1. 关键代码:使用 switch 或 if 判断语句,改变对应的二级菜单显示方式为 block 或 none function selectTabMenu(i){ switch(i){ case 71: document.getElementById("TabMenuCon71").style.display="block"; document.getElementById("TabMenuCon72").style.display="…
1.鼠标感应--渐现特效 鼠标感应渐显图片[平时很模糊的图片鼠标一放上就显示清楚] [修改图片名称即可][共2步] ====1.将以下代码加入HTML的<head></head>之间: <script language="JavaScript1.2"> function makevisible(cur,which){ if (which==0) cur.filters.alpha.opacity=100 else cur.filters.alpha.…
转载自:Javascript特效代码大全(420个) 收集资料,以便使用+面试+学习  ├ Cookie脚本 ├ 随访问次数变提示 ├ 集成Cookies ├ 使窗口仅弹出一次 ├ 签名提示程序 ├ 记录上次登录时间 ├ 自由控制打开窗口 ├ 记录页面修改时间 ├ 检测IE去过站点 ├ 离开时显示信息 ├ 弹出窗口自动关闭 ├ 离开页面弹出窗口 ├ 进入时显示信息 ├ 离开启动收藏夹 ├ 链接确认按钮 ├ 点击加入收藏夹 ├ 记录页面更新时间 ├ 页面载入等待 ├ 打开硬盘驱动器 ├ 设置默认首…
我们有三种主要的方法(从难到易):自己动手写脚本;使用类似于jQuery和mooTools的JavaScript框架(可以让编写代码变得更容易些);使用能工作于现有的JavaScript框架下的提前预置好的脚本或那种从头开始开发的创建者.这篇文章适合那些打算提高工作效率或不愿意从头开发脚本的人阅读. 您还可以参考以下JavaScript/Ajax相关教程及资源:<10个非常棒的Ajax及Javascript实例资源网站><12种Javascript解决常见浏览器兼容问题的方法>&l…
注:本文以及以下关于Javascript特效源码都是分享自JavaScript源码大全. 1.逐隐逐现的的特效 逐隐逐现的文字特效[推荐使用][适用于IE4++] (修改显示的文字后根据说明进行共2步) 1.以下代码放在一个新建页面的HTML的<body></body>区即可:[页面上必须什么都没有] <html> <head> <TITLE>特效</TITLE> </head> <script language=j…
JavaScript特效 一.在网页上显示当前的时间日期,例如:“2016年3月26日 星期六”. js源代码: function getTime() { var today = new Date(); //返回当日的日期和时间. var year = today.getFullYear(); //获得当前的年份 var month = today.getMonth() + 1; //获得当前的月份 var day = today.getDate(); //获得当前的日期 var weekday…
第六章   Canvas与javaScript特效笔记 q  <canvas>标签的用途 HTML5 canvas 提供了通过 JavaScript 绘制图形的方法,此方法使用简单但功能强大.每一个canvas 元素都有一个"上下文( context )" (想象成绘图板上的一页),在其中可以绘制任意图形.浏览器支持多个 canvas 上下文,并通过不同的 API 提供图形绘制功能. 为了能在 JavaScript 中引用元素,最好给元素设置 id:也需要给 canvas…
鼠标事件有Keydown, Keyup, Keypress,但Keypress与Keydown和Keyup不同,如果按ctrl, shift, caps lock......等修饰键,不会触发Keypress事件,而会触发Keydown和Keyup事件,这就是Keypress事件与Keydown.Keyup事件的不同之处.另外,通常使用Keypress事件来获取用户输入信息. 继续使用"JavaScript进阶系列05,事件的执行时机, 使用addEventListener为元素同时注册多个事件…
在网页中,假设出现两次<script type="text/javascript"></script>标签,全部的JavaScipt脚本都不会再生效,仅仅能出现一次<script type="text/javascript"></script>标签,可是.同一个网页中经常须要多个JavaScript特效. 本文在2014.11.10又作了改动.原因是笔者发现另外一种方法 一.基本目标 在网页中挂载两个JavaScrip…
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>每天一个JavaScript实例-铺货鼠标点击位置并将元素移动到该位置</title> <style> #info{ width:100px; height:100px;…
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>鼠标跟随一串效果</title> <style type="text/css"> div{ width: 30px; height: 30px; background: #008000; position: absolute; left: 10px; top: 10p…
春节临近,要做活动促销专题页面,百度了下,找到一些烟花燃放的特效,整理并添加了修改烟花各种参数的注释,便于大家修改使用,版权归原作者所有. 1. 示例效果:点击这里   下载源码:点击这里 2. Html代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> &…
<!DOCTYPE html><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <style type="text/css"> body, div{margin:0;padding:0;} html{font-size:62.5%;height:100%;background-color:#111…
就像QQ宠物或者迅雷悬浮窗口一样,鼠标点下去窗体跟着鼠标动 主要是两个时间的加载 MouseDown和MouseMove事件 MouseDown事件: private int _StartX ;//鼠标点下去的坐标 private int _StartY ; private void Form1_MouseDown(object sender, MouseEventArgs e) { _StartX = e.X;//e是鼠标点下去的事件 _StartY = e.Y; } MouseMove事件…
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> </head> <body> <h1>第一个界面</h1> <a href="js02history.html">当前页面</a> <a hr…
实现鼠标滚动滚轮事件: <script type="text/javascript"><pre name="code" class="javascript"> var scrollFunc=function(e){ e=e || window.event; if(e.wheelDelta){//IE/Opera/Chrome if(e.wheelDelta==120) { //向上滚动事件 alert(e.wheelDet…
技巧一.添加链接提示 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="…
在一家VR公司做前端. 起初进入前端就是一种内心的直觉,创造更好的用户体验,让页面更加友好,当然最起初接手web项目还是为了完成毕业设计. 一个网上图书商城,虽然不大,但五脏都有毕竟开刀所以避免不了很多瑕疵,项目在....待我验证下好久没去看了!https://github.com/gitxiao5/html5/tree/master/%E6%AF%95%E4%B8%9A%E8%AE%BE%E8%AE%A1. 今年三月份才开始正式的工作,工作了大半年了,前端一直都没有断过,即时有时还有其他的事情…
即实现鼠标点击其中一个菜单发生样式的改变,当点击下一个菜单时,当前菜单样式改变,其他菜单均变为之前样式. 用JavaScript,jQuery都可以实现,只是后者是封装的JavaScript库,具有sibling()方法,可以直接使其同胞元素取消样式,而JavaScript需要使用循环来使其上一菜单样式取消,当前菜单加上样式. 关于代码:JavaScript <script> var arr = document.getElementsByTagName("li"); ;…
1.文本框焦点问题onBlur:当失去输入焦点后产生该事件onFocus:当输入获得焦点后,产生该文件Onchange:当文字值改变时,产生该事件Onselect:当文字加亮后,产生该文件 <input type="text" value="mm" onfocus="if(value=='mm) {value=''}" onblur="if(value=='') {value='mm'}">点击时文字消失,失去焦点…
1.给网页设定快捷键 js: function getkey(){     event = event || window.event;     url = "www.baidu.com";     asc = event.keycode;     key = String.fromCharCode(asc);     if(key == "G"){         ret = confirm("您要前往" + url + "页面吗?&…
在运用鼠标移入移出事件时,一般有两种做法,一种是DOM事件的"onmouseover"和"onmouseout",还有一种是css的伪类":hover". 在实际运用中如何选择,取决于清楚明白的了解他们之间的区别. HTML DOM 允许 JavaScript 对 HTML 事件作出反应. 在我们为元素绑定了一个事件,当事件发生的时候,可以执行一段javascript代码. 关于鼠标事件,总共有: onmouseover和onmouseout 鼠…
javascript使用mouseover和mouseout,只在css中支持hover jquery支持mouseover和mouseout,封装了mouseenter.mouseleave事件函数和hover函数 1.有关js中的mouseover和mouseout 原生js的事件类型是mouserout和mouseover,之前提到的事件冒泡的缺陷就在这里,之前说的使用阻止冒泡就行,大概说得太轻易.来理一理它们的触发顺序吧. <div id=”f1”> <div id=”c1”&g…
右键点击触发是浏览器的默认菜单事件contextmenu,你可以选择阻止它,使用event.preventDefault();或者return false;. 想要定义右键点击事件,关注的是mouseup或者mousedown事件,使用event获取点击的键: Js中使用event. button---0,1,2分别是左键.滚轮.右键 Jq中使用event.which---1,2,3分别是左键.滚轮.右键 <!DOCTYPE html> <html lang="zh-cn&qu…
7.将站点加入频道栏 将站点加入频道栏[看详细说明] ====1.加入channel的方法:使用如下连接指向你的频道文件*.cdf. <a href="javascript:window.external.addChannel('jschannel.cdf')"> ============================================================================================== *.cdf文件的内容如…
闲来无事在网站上看见一个网页制作的不错,就仿照做来看看.特此记录下来. 亮点:随鼠标上下滚动,展示页面随之不同,翻动效果. 功能点:鼠标向上,向下判断事件. css 代码 html { overflow-y: hidden; } .hide { display: none; } .show { display: block; } .box { height: 650px; width: 100%; } .foot { position: fixed; height: 100px; top: 15…
<!doctype html> <html> <head> <meta charset="utf-8"> <title>无标题文档</title> <style type="text/css"> *{ margin:0; padding:0;} body{ height:2000px;} #box{ width:40px; height:40px; display:none; pos…
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>背景时钟</title> </head> <body> <p id="bgclockshade" style="position:absolute;visibility:visible;font-f…
这个效果的实现关键是对Date对象和setTimeout的使用. 一共有三个例子,HTML结构如下,就不添加CSS样式了. <body> 当前时间:<p id="p1"></p> 高考倒计时:<p id="p2"></p> 限时抢购:<p id="p3"></p> </body> 主要体会javascript的实现 window.onload=func…