Board logo

标题: [原创]DIV+CSS 纯静态实现梦游科技紧急通知的制作方法 [打印本页]

作者: An_Apple     时间: 2009-1-2 11:23 PM     标题: [原创]DIV+CSS 纯静态实现梦游科技紧急通知的制作方法

[原创]An_Apple教你用 DIV+CSS 纯静态实现梦游科技紧急通知是如何怎么做实现的?

这是个老帖了(原帖),因为有人需要,所以有必要专门开个帖子来发下。

其实很简单的问题,因为是静态的,代码可以全部拷贝来的,呵呵。
用的是Div+JavaScript,层+js脚本
把如下代码放到你的网页

CODE:
[复制代码到粘贴板]
<div id=divadv style='position: absolute; left: 0; top: -370;filter:alpha(opacity=100)'>
<table border='0' width='100%' cellspacing='0' cellpadding='0' bgcolor="#F8F8F8">
<tr>
<td></td>
</tr>
<tr>
<td height='30' valign='top'>
<table border='0' width='100%' cellspacing='0'>
<tr>
<td align="center"><font color="#000080"><b><font size="4">

梦游科技紧急通知:</font></b></font></td>
<td width='121'>
<input type="button" value="关闭公告" name="B3"

onclick="hideadv()" style="color: #000080; border: 1px solid #808080; padding: 3px;

background-color: #FFFFFF"></td>
</tr>
<tr>
<td height=1 bgcolor=#DDDDDD></td>
<td width='121' height=1 bgcolor=#DDDDDD></td>
</tr>
</table>
</td>
</tr>
<tr>
<td align='center' valign='top'>
<table border='0' width='880' cellspacing='0' cellpadding='0'>
<tr>
<td width='30' valign='top'>
 </td>
<td valign='top' width='813' style='font-size:12px;line-

height:1.5'>
<font color='#800000'>因不可抗拒因素,主服务器恢复至2007-02-07数据,导致07-14的订单丢失,如果您在这几天提交的订单或是金额,请联系我们补单。</font>
<br /><font color='800000'>客服人员:100366636 , 306881044 .MSN:admin@meyu.net , jackc@pdxx.com . 给您造成的不便深感抱歉,顺祝大家新年快乐,万事如意!</font></td></tr>
</table>
</td>
</tr>

<tr>
<td height="6"></td>
</tr>

<tr>
<td height="1" bgcolor=#DDDDDD></td>
</tr>
<tr>
<td height="1" bgcolor=#848484></td>
</tr>
</table>
<script language="JavaScript" src="load.js" type="text/javascript"></script>
</div>
然后把如下javascript代码保存为load.js文件保存到网页的同一个目录里(具体看上面的<script language="JavaScript" src="load.js" type="text/javascript"></script>
里面load.js路径是怎么填写的).

CODE:
[复制代码到粘贴板]
function showadv(){
var advword=eval('divadv');
if (advword.style.pixelTop<0)
{
advword.style.pixelTop+=5;
setTimeout('showadv()',10);
}
else
{
setTimeout('hideadv()',30000);
}
}
function hideadv(){
var advword=eval('divadv');
if (advword.style.pixelTop>-370)
{
advword.style.pixelTop-=10;
setTimeout('hideadv()',10);
}
else
{
advword.innerHTML='';
}
}
var dateA = new Date("2009/1/1");
var dateB = new Date("2020/12/25");
var now = new Date();
if (now>dateA && now<dateB)
showadv();
不妨用我的空间预览下:  http://gmail.91.tc/site/meyu/index.html

更详细代码见附件,所有代码已打包.

CODE:
[复制代码到粘贴板]
var dateA = new Date("2009/1/1");
var dateB = new Date("2020/12/25");
var now = new Date();
if (now>dateA && now<dateB)
showadv();
这里的代码是定义公告的开始和结束时间,其他的(比如公告展示多少秒后自动关闭,默认参数是 10 )自己慢慢摸把.  

所有演示代码已经打包至附件,欢迎下载。最后祝所有 meyu 朋友新年快乐!

[ 本帖最后由 An_Apple 于 2009-1-2 11:30 PM 编辑 ]

附件: div+css.rar (2009-1-2 11:23 PM, 36.31 K) / 该附件被下载次数 51
http://web.meyu.net/attachment.php?aid=2758
作者: meyu     时间: 2009-1-3 12:04 AM

不是发过了?
作者: 泡海椒     时间: 2009-1-3 04:54 PM

MUYU科技 值得性耐!


作者: An_Apple     时间: 2009-1-3 05:12 PM



QUOTE:
原帖由 meyu 于 2009-1-3 12:04 AM 发表
不是发过了?


作者: dragongod     时间: 2009-1-3 07:05 PM

恩。。又素JS。。JS拖得我的站慢的要死要死地。算了无视。自己看着爽就好,浏览体验死一边去。。
作者: mingelz     时间: 2009-1-6 02:49 PM

留下了~
作者: 92uu     时间: 2009-1-6 02:54 PM


作者: 0038     时间: 2009-1-15 12:57 PM

路过
作者: An_Apple     时间: 2009-1-17 03:33 PM

感谢大家支持。
作者: hugoyuan     时间: 2009-1-29 06:42 PM

没法收藏主题啊
作者: An_Apple     时间: 2009-2-1 01:03 PM



QUOTE:
原帖由 hugoyuan 于 2009-1-29 06:42 PM 发表
没法收藏主题啊
浏览器收藏夹。
作者: mingrxp     时间: 2009-2-9 10:23 AM

什么紧急通知?没见过呢。。。。。。我FireFox = =
作者: An_Apple     时间: 2009-2-14 11:41 AM



QUOTE:
原帖由 mingrxp 于 2009-2-9 10:23 AM 发表
什么紧急通知?没见过呢。。。。。。我FireFox = =
firefox 也可看到。
作者: An_Apple     时间: 2009-6-13 02:46 AM

补充:在浏览器平台 Firefox 2009 China Edition 火狐中国版上,这个代码无效。 很遗憾。
作者: m80     时间: 2010-1-10 12:09 AM

看看哦。。。。。。。。




欢迎光临 梦游时光互联 (http://web.meyu.net/) Powered by Discuz! 4.0.0