js の完璧な画像ニュース回転効果、Tencent Dayue.com_javascript スキルのホームページの画像回転から修正

背景
私が望む完璧な画像ニュース回転効果:
1. ニュース画像、ニュースタイトル、回転インデックスがあります
2. マウスがインデックスに移動しないと、画像が自動的に切り替わります
3 .マウスをインデックス上に移動すると、既存の画像が表示され、ポーリングが停止します
4. マウスをインデックスから遠ざけると、ポーリングが続行されます
5. シンプル、明確、軽量 (サードパーティのファイル、できればネイティブ js に依存しません)

プロセス
多くの画像ポーリング効果を見つけましたが、それらは常に私の要件とは多少異なり、完璧であることはできません。機能的ではないか、派手すぎるかのどちらかです。自分でも開発したかったのですが、些細な事が遅れて着手できずにいます。
Tencent Dayue.com の写真ニュースを時々見ることがありますが、これは私が望んでいる効果のように感じます。しかし、注意深くテストした結果、要件 3 を満たしていないことが判明しました。つまり、ポーリング停止メカニズムはありません。考えてみれば、自分で修正したほうが良いかもしれません。それは私の要件にほぼ一致するでしょう。
アイデア: ページがロードされ、写真のポーリングが開始されます。マウスをインデックスに移動すると、関連する画像が表示され、投票がクリアされます。マウスをインデックスから遠ざけると、ポーリングが再開されます。
現在アクティブ化されているイメージ インデックス ID を記録するグローバル変数 ID を定義します。回転するたびに、この ID が更新されます。マウスがインデックスから離れたら、この ID を使用してポーリングを開始します。

コードをコピー コードは次のとおりです:

焦点图文字背景

href="/a/20111119/000002.htm">
广州花都拆违遭遇碎瓶煤气罐

焦点图文字背景

href="/a/20111119/000028.htm">
一颗“钉子”放弃工作保祖屋5年

焦点图文字背景

href="/a/20111117/000250.htm">
爸爸，不要把我丢下

焦点图文字背景

href="/a/20111119/000004.htm">
杨幂最新杂志写真 魅惑优雅

• 1


• 2


• 3


• 4

<script><br>//マウスを移動するアクション。現在の画像を表示し、ポーリングをクリアします。 <br>function adchangea(adid) { <br>dochange(adid); <br>clearTimeout(adisround); <br>} <br>//自動ポーリング<br>function adchangea2(adid) { <br>dochange ( adid); <br>var adbigimg = document.getElementById("adpica").getElementsByTagName("div"); <br>if ((adnext = adid 1) > adbigimg.length) <br> adisround = setTimeout('adchangea2(' adnext ')', 3000); <br>} <br>//現在の画像を表示します <br>function dochange(adid) { <br>id = adid>var adbigimg = document.getElementById("adpica").getElementsByTagName("div"); <br>var adsmallimg = document.getElementById("adtipa").getElementsByTagName("li"); ; adbigimg.length; adi ) { <br>adbigimg[adi].className = ""; <br>adbigimg[adid - 1].className = "表示"; <br>adsmallimg[adid - 1].className = "現在"; <br>} <br>var adisround = setTimeout("adchangea2(2)", <br>var id;/ /現在のアクティベーション ID <br>//マウスが ul ブロッ​​クから離れると、ポーリングが再開されます。 <br>function change() { <br>adchangea2(id) <br>} <br></script>