用一段js程序来实现动画功能_javascript技巧
自从ie对flash的显示方式进行改变后,flash这个东西一下子变成了一个鸡肋。
许许多多的网站都撤掉了以前的flash动画,改用一段js程序来实现动画功能.
csdn首页也是如此。。我无聊,自己写了一个,特点如下:
1.对搜索引擎友好
2.对美工友好,因为数据和代码是分开的,完全不懂js的都可以用fontpage修改动画内容
可以把js代码保存为一个文件 然后<script></script>,然后无须修改代码一个字母
就可以在多个页面中实现动画了
代码如下:

href="http://www.baidu.com/" for="http://zi.csdn.net/xian.gif" target="_blank">1.CSDN程序员href="http://www.126.com/" for="http://zi.csdn.net/microsoft280_187.jpg" target="_blank">2.CSDN程序员href="http://mp3.baidu.com/" for="http://zi.csdn.net/live.gif" target="_blank">3.CSDN程序员href="http://post.baidu.com/" for="http://zi.csdn.net/new-mba.gif" target="_blank">4.CSDN程序员href="http://top.baidu.com/" for="http://zi.csdn.net/book.jpg" target="_blank">5.CSDN程序员
<script> <BR>function f(){ <BR> var g_sec=3 //几秒后切换图片 <BR> var g_items=new Array() <BR> var g_div=document.getElementById("g_div") <BR> var g_img=document.getElementById("g_img") <BR> var g_imglink=g_img.parentElement <BR> var arr=g_div.getElementsByTagName("A") <BR> var arr_length=arr.length <BR> var g_index=1 <br><br> var show_img=function(n){ <BR> if (/\d+/.test(n)){ <BR> var prev=g_index+1 <BR> g_index=n-1 <BR> }else{ <BR> var prev=(g_index>arr.length)?(arr_length-1):g_index+1 <BR> g_index=(g_index<arr_length-2)?(++g_index):0 <BR> } <BR> if (document.all){ <BR> g_img.filters.revealTrans.Transition=23; <BR> g_img.filters.revealTrans.apply(); <BR> g_img.filters.revealTrans.play(); <BR> } <BR> arr[prev].className="b" <BR> arr[g_index+1].className="bhover" <BR> g_img.src=g_items[g_index].img.src <BR> g_img.title=g_items[g_index].txt <BR> g_imglink.href=g_items[g_index].url <BR> g_imglink.target=g_items[g_index].target <br><br> } <br><br> for(var i=1;i<arr_length;i++){ <BR> g_items.push({txt:arr[i].innerHTML, <BR> url:arr[i].href, <BR> target:arr[i].target, <BR> img:(function(){var o=new Image;o.src=arr[i].getAttribute("for");return o})()}) <BR> arr[i].title=arr[i].innerHTML <BR> arr[i].innerHTML=[i," "].join("") <BR> arr[i].className="b" <BR> arr[i].onclick=function(){ <BR> event.returnValue=false; <BR> show_img(event.srcElement.innerText) <BR> } <BR> } <BR> show_img(1) <BR> var t=window.setInterval(show_img,g_sec*1000) <BR> g_img.onmouseover=function(){window.clearInterval(t)} <BR> g_img.onmouseout=function(){t=window.setInterval(show_img,g_sec*1000)} <BR>} <br><br>window.attachEvent("onload",f) <BR></script>

ホットAIツール

Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。

Undress AI Tool
脱衣画像を無料で

Clothoff.io
AI衣類リムーバー

AI Hentai Generator
AIヘンタイを無料で生成します。

人気の記事

ホットツール

メモ帳++7.3.1
使いやすく無料のコードエディター

SublimeText3 中国語版
中国語版、とても使いやすい

ゼンドスタジオ 13.0.1
強力な PHP 統合開発環境

ドリームウィーバー CS6
ビジュアル Web 開発ツール

SublimeText3 Mac版
神レベルのコード編集ソフト(SublimeText3)

ホットトピック











JavaScript文字列置換法とFAQの詳細な説明 この記事では、javaScriptの文字列文字を置き換える2つの方法について説明します:内部JavaScriptコードとWebページの内部HTML。 JavaScriptコード内の文字列を交換します 最も直接的な方法は、置換()メソッドを使用することです。 str = str.replace( "find"、 "置換"); この方法は、最初の一致のみを置き換えます。すべての一致を置き換えるには、正規表現を使用して、グローバルフラグGを追加します。 str = str.replace(/fi

このチュートリアルでは、カスタムGoogle検索APIをブログまたはWebサイトに統合する方法を示し、標準のWordPressテーマ検索関数よりも洗練された検索エクスペリエンスを提供します。 驚くほど簡単です!検索をyに制限することができます

それで、あなたはここで、Ajaxと呼ばれるこのことについてすべてを学ぶ準備ができています。しかし、それは正確には何ですか? Ajaxという用語は、動的でインタラクティブなWebコンテンツを作成するために使用されるテクノロジーのゆるいグループ化を指します。 Ajaxという用語は、もともとJesse Jによって造られました

この記事シリーズは、2017年半ばに最新の情報と新鮮な例で書き直されました。 このJSONの例では、JSON形式を使用してファイルに単純な値を保存する方法について説明します。 キー価値ペア表記を使用して、あらゆる種類を保存できます

楽なWebページレイアウトのためにjQueryを活用する:8本質的なプラグイン jQueryは、Webページのレイアウトを大幅に簡素化します。 この記事では、プロセスを合理化する8つの強力なjQueryプラグイン、特に手動のウェブサイトの作成に役立ちます

コアポイント これは通常、メソッドを「所有」するオブジェクトを指しますが、関数がどのように呼び出されるかに依存します。 現在のオブジェクトがない場合、これはグローバルオブジェクトを指します。 Webブラウザでは、ウィンドウで表されます。 関数を呼び出すと、これはグローバルオブジェクトを維持しますが、オブジェクトコンストラクターまたはそのメソッドを呼び出すとき、これはオブジェクトのインスタンスを指します。 call()、apply()、bind()などのメソッドを使用して、このコンテキストを変更できます。これらのメソッドは、与えられたこの値とパラメーターを使用して関数を呼び出します。 JavaScriptは優れたプログラミング言語です。数年前、この文はそうでした

jQueryは素晴らしいJavaScriptフレームワークです。ただし、他のライブラリと同様に、何が起こっているのかを発見するためにフードの下に入る必要がある場合があります。おそらく、バグをトレースしているか、jQueryが特定のUIをどのように達成するかに興味があるからです

この投稿は、Android、BlackBerry、およびiPhoneアプリ開発用の有用なチートシート、リファレンスガイド、クイックレシピ、コードスニペットをコンパイルします。 開発者がいないべきではありません! タッチジェスチャーリファレンスガイド(PDF) Desigの貴重なリソース
