闲扯 Javascript 03 时钟和QQ延时框
时钟 ：
所用到得图片 
：
<body style="background:#000; color:#FFF; font-size:50px;"> <div id="div1">
<img src="data:images/0.png"/>
<img src="data:images/0.png"/>
:
<img src="data:images/0.png"/>
<img src="data:images/0.png"/>
:
<img src="data:images/0.png"/>
<img src="data:images/0.png"/>
</div>
</body>
HTML
<script>
function ChangeString(n)
{
if(n<10)
{
return "0"+n;
}
else
{
return ""+n;
}
}
window.onload=function ()
{
var oDiv=document.getElementById('div1');
var oImg=oDiv.getElementsByTagName('img');
//var str="120343";
function hours(){ var date=new Date();
var str= ChangeString(date.getHours())+ ChangeString(date.getMinutes())+ ChangeString(date.getSeconds());
for(var i=0;i<str.length;i++)
{
oImg[i].src='images/'+str[i]+'.png';
}
}
setInterval(hours,1000);
hours();
}
</script>
QQ延时框：
<body> <div id="div1"></div> <div id="div2"></div>
</body>
HTML
<style>
div{ float:left; margin:10px;}
#div1{ background:#F00; width:60px; height:60px;}
#div2{ background:#666; width:160px; height:160px; display:none;} </style>
CSS
<script>
window.onload=function ()
{
var oDiv1=document.getElementById('div1');
var oDiv2=document.getElementById('div2'); oDiv1.onmouseover=function ()
{
oDiv2.style.display='block';
clearTimeout(time);//必须放下面
}
oDiv1.onmouseout=function ()
{ timer=setTimeout(function ()
{
oDiv2.style.display='none';
},500); } oDiv2.onmouseover=function ()
{
clearTimeout(timer);
oDiv2.style.display='block';
} oDiv2.onmouseout=function ()
{
time=setTimeout(function ()
{
oDiv2.style.display='none';
},500);
}
} </script>
闲扯 Javascript 03 时钟和QQ延时框的更多相关文章
- QQ聊天框变成方框口口口口的解决办法
QQ聊天框变成方框口口口口的解决办法 安装了QQ拼音输入法6.0之后,发现 QQ聊天对话框好友名称变成框口口口口口,网上没有找到办法,卸载轻聊版,安装完整版9.03之后,再次启动就好了.
- pushlet（QQ提示框）
Pushlet 实现服务端往客服端推送消息 系统页面弹出消息框,类似QQ提示框 1. java代码 package com.test.jbpm.common; import java.io.Seria ...
- JavaScript小例子：复选框全选
JavaScript小例子:复选框全选 这只是一个小例子,很简单,但是这个功能还是很常用的: 实现后效果如图: JavaScript代码: <script type="text/jav ...
- 如何用iframe标签以及Javascript制作时钟？
如何利用iframe标签以及Javascript制作时钟? 如何制作一个时钟呢?效果如下图所示: 这里的时钟会不停的走,但是下面的页面是不会变得,这样就实现了我们想要的效果了.下面我将分为以下几个方面 ...
- QLineEdit 仿QQ签名框（思路很独特：用QSS::hover显示额外的图片）
今天鼓捣了半天,终于实现了自定义Qt中的QlineEdit控件的大致效果. 这个问题对于新手而言,主要有以下几个难点: 1.继承QLineEdit控件 2.QSS设置QLineEdit的相关样式,可以 ...
- JavaScript学习笔记之下拉选择框的操作
对于下拉框的操作十分繁多,这几天项目须要就总结一下 一.动态构建option 有时候我们须要动态构建下拉选择框里面的值,这里我们就要用到 var varItem = new Option(" ...
- 闲扯 Javascript 00
引言 Javascript 的作用在此就不阐述了,相信你已经知道它的用途!那我说点什么呢? 不如就和大家先扯一把,后面的工作 随后后展开吧! 首先声明:我个人对Javascript 认识,我只知道它 ...
- QLineEdit 仿QQ签名框
今天鼓捣了半天,终于实现了自定义Qt中的QlineEdit控件的大致效果. 这个问题对于新手而言,主要有以下几个难点: 1.继承QLineEdit控件 2.QSS设置QLineEdit的相关样式,可以 ...
- [Qt] QLineEdit 仿QQ签名框
今天鼓捣了半天,终于实现了自定义Qt中的QlineEdit控件的大致效果. 这个问题对于新手而言,主要有以下几个难点: 1.继承QLineEdit控件 2.QSS设置QLineEdit的相关样式,可以 ...
随机推荐
- URAL 1303
题目大意:给出N个区间[Li,Ri](1<=i<=N),一个正整数M,求N个区间里,并区间包含[0,M]的区间的最小个数(无解时输出:No solution). KB 64bit ...
- MessageDigest简单介绍
本文博客原文 參考文章:http://blog.sina.com.cn/s/blog_4f36423201000c1e.html 一.概述 java.security.MessageDigest类用于 ...
- 关于Repeater中使用DorpWownList的问题
关于Repeater中使用DorpWownList的问题 前台: <asp:Repeater ID="Repeater1" runat="server" ...
- java中只能有一个实例的类的创建
Java中,如果我们创建一个类,想让这个类只有一个对象,那么我们可以 1:把该类的构造方法设计为private 2:在该类中定义一个static方法,在该方法中创建对象 package test; / ...
- TCP粘包和半包的处理方法
先把处理的方法的代码放这里: 解析数据帧的代码: bool CSocket::findData(byte* buff, int& len) { for (int i = 0; i <= ...
- windows7 安装python
首先去Python官网,https://www.python.org 找到downloads,我这里系统是win7 x64,下载的是最新版本3.4.2 下载完成后有个msi文件,选择文件安装目录,一路 ...
- php随笔4-thinkphp 学习-ThinkPHP3.1快速入门（2）数据CURD
ThinkPHP3.1快速入门(2)数据CURD 浏览:194739 发布日期:2012/09/05 分类:文档教程 关键字: 快速入门 CURD 上一篇中,我们了解了ThinkPHP的基础部分, ...
- nginx下配置二级域名指向子目录
今天终于把nginx的二级域名配置搞定了,哎之前在测试服务器上弄过一次,不过那个是在本地解析的hosts,把ip指向到域名上就ok,再在nginx.conf里改了下配置就好了,用同样的方法改了正式服务 ...
- 分支-15. 日K蜡烛图(15)
#include<iostream> using namespace std; int main(){ float o,h,l,c; while(cin>>o>>h ...
- Ruby学习： 类的定义和实例变量
ruby是完全面向对象的,所有的数据都是对象,没有独立在类外的方法,所有的方法都在类中定义的. 一.类的定义语法 类的定义以 class 关键字开头,后面跟类名,以 end标识符结尾. 类中的方法以 ...