A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

本帖最后由 张龙欢 于 2013-6-7 09:40 编辑

  1. <P> </P>
  2. <DIV class=blockcode>
  3. <BLOCKQUOTE><!DOCTYPE html>
  4. <html>
  5. <head>
  6. <title>切换广告图片</title>

  7. <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
  8. <meta http-equiv="description" content="this is my page">
  9. <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  10. <style type="text/css">
  11. #div5 img {
  12. cursor: pointer;
  13. }
  14. </style>
  15. <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
  16. <script type="text/javascript">

  17. var num = 1;

  18. var timer ;

  19. // 2 计算出需要显示的图片的数字
  20. // 换图的方法
  21. function change() {
  22. // 获得一个数字(1-4) 当前要显示的图片
  23. num = num+1;
  24. if(num>4)
  25. num = 1;

  26. disImg(num);

  27. }

  28. //3 将指定编号的图片显示
  29. function disImg(num) {
  30. // 所有图隐藏
  31. hidden();
  32. // 当前图显示
  33. document.getElementById("div"+num).style.display = "block";
  34. }

  35. // 隐藏所有的图片 公共方法
  36. function hidden() {
  37. document.getElementById("div1").style.display = "none";
  38. document.getElementById("div2").style.display = "none";
  39. document.getElementById("div3").style.display = "none";
  40. document.getElementById("div4").style.display = "none";
  41. }

  42. // 停止换图 鼠标进入事件
  43. function stop() {
  44. window.clearInterval(timer);
  45. }

  46. // 开始换图 鼠标出去的事件
  47. function begin() {
  48. timer = window.setInterval(change, 1000);
  49. }

  50. // 1页面加载完毕时调用
  51. window.onload = function()
  52. {
  53. // 显示第一张图片
  54. hidden();
  55. document.getElementById("div1").style.display = "block";

  56. }

  57. </script>
  58. </head>

  59. <body>
  60. <div style="width: 340px; height:340px; position: absolute; left: 10px; top: 10px;" onmouseover="stop()" onmouseout="begin()">
  61. <div id="div1" style="width: 320px; height:320px; border: 2px solid #000000; position: absolute; left: 10px; top: 10px;">
  62. <img src="..\image\Vitas.jpg" />

  63. </div>
  64. <div id="div2" style="width: 320px; height:320px; border: 2px solid #000000; position: absolute; left: 10px; top: 10px;">
  65. <img src="..\image\杜德伟.jpg" />

  66. </div>
  67. <div id="div3" style="width: 320px; height:320px; border: 2px solid #000000; position: absolute; left: 10px; top: 10px;">
  68. <img src="..\image\唐笑.jpg" />

  69. </div>
  70. <div id="div4" style="width: 320px; height:320px; border: 2px solid #000000; position: absolute; left: 10px; top: 10px;">
  71. <img src="..\image\王力宏.jpg" />

  72. </div>
  73. <div id="div5" style="position: absolute; left: 240px; top: 300px;">
  74. <img border="1" width="15px" src="..\image\1.jpg" onclick="disImg(1)" />
  75. <img border="1" width="15px" src="..\image\2.jpg" onclick="disImg(2)" />
  76. <img border="1" width="15px" src="..\image\3.jpg" onclick="disImg(3)" />
  77. <img border="1" width="15px" src="..\image\4.jpg" onclick="disImg(4)" />
  78. </div>
  79. </div>
  80. </body>
  81. </html>
复制代码
我的问题是我没有动作的时候怎么让图片自动切换???

评分

参与人数 1技术分 +1 收起 理由
袁梦希 + 1 很给力!

查看全部评分

4 个回复

正序浏览

好的!!!!!!!!!!
回复 使用道具 举报
{:soso_e179:}              努力
回复 使用道具 举报
加上执行的标签flag,然后选择执行不就可以的了。嵌套if
回复 使用道具 举报
您需要登录后才可以回帖 登录 | 加入黑马