Javascript实现图片轮显与字体发光

本文介绍如何使用Javascript实现网站上图片的随机展示及文本的闪光效果。通过编写简单的JS脚本来生成随机数,从而每次加载页面时展示不同的图片。此外,还介绍了如何设置文本的闪光效果,包括字体颜色的闪烁变化。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

ContractedBlock.gifExpandedBlockStart.gif代码
因工作需要,要用到Javascript,老板看到别人网站做的很好,每次打开都是不同的图片,要这种效果.
其实就是利用Javascript的几个函数,每次调用的时候,利用随机数,调用不同的图片,先说第一个功能

1. 利用Javascript每次调用不同的图片(当然你也可以实现,在打开以后,让他在一定的时间段,自动的调用另外一张图片,这样就可以实现图片轮询了.)
先写好简单的Javascript脚本.你也可以复制了保存起来,保存为 jiaoben.js

引用内容

today
=new Date();
  jran
=today.getTime();
  
function rnd() {
  ia
=9301;
  ic
=49297;
  im
=233280;
  jran
= (jran*ia+ic) % im;
  return jran
/(im*1.0);
  };
  
function rand(number) {
  return Math.ceil(
rnd()*number);
  };
  document.write(
"<center>");
  
for(i=1;i<=1;i++) {
  myNum
=(rand(7)); //改成你要随机显示的图片数;
  
if(myNum == 1) document.write("<img src='images/Images01.jpg'>");

//图片路径,可用http://
  
if(myNum == 2) document.write("<img src='images/Images02.jpg'>");
  
if(myNum == 3) document.write("<img src='images/Images03.jpg'>");
if(myNum == 4) document.write("<img src='images/Images04.jpg'>");
if(myNum == 5) document.write("<img src='images/Images05.jpg'>");
if(myNum == 6) document.write("<img src='images/Images06.jpg'>");
if(myNum == 7) document.write("<img src='images/Images07.jpg'>");

  
else {
  document.write();
  }
  };
  document.write(
"</center>");



看的出来,上面的myNum就是随机数,调用不同的图片就靠他了.
在网页中,加入调用代码:
<script src="jiaoben.js"></script>
这样就可以了.

2.利用Javascript实现字体闪光. 颜色可以自己选.可以直接写在网页中,也可以用js调用

引用内容

<script>
var message
="我们还很年轻,离不开您的批评和建议。"
var n
=0;
if (document.all){
document.write(
'<font size="12px" color="EFEFEF">')
for (m=0;m<message.length;m++)
document.write(
'<span id="neonlight" style="font-size:12px">'+message.charAt(m)+'</span>')
document.write('</font>')
var tempref=document.all.neonlight
}
else
document.write(message)
function neon(){
if (n==0){
for (m=0;m<message.length;m++)
tempref[m].style.color
="ffffff"
}
tempref[n].style.color
="d50000"
if (n<tempref.length-1)
n
++
else{
n
=0
clearInterval(flashing)
setTimeout(
"beginneon()",2500)
return
}
}
function beginneon(){
if (document.all)
flashing
=setInterval("neon()",30)
}
beginneon()
</script>

 

转载于:https://www.cnblogs.com/cyrix/articles/1706919.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值