Imitation Thunder フォーカス広告効果 (JQuery 版)

1 つ目は JS コード部分です:

$(document).ready(function(){ 
var imgUrl = new Array(); 
var title = new Array(); 
var description = new Array( ); 
var imgLink = new Array(); 
var local; //ポインタ位置
count = 7;画像
imgUrl[1] = "画像/ceshi.jpg"; 
imgUrl[2] = "画像/ceshi1.jpg"; 
imgUrl[3] = "画像/ceshi.jpg"; 🎜>imgUrl[4] = "画像/ceshi1.jpg"; 
imgUrl[5] = "画像/ceshi.jpg"; 
imgUrl[6] = "画像/ceshi1.jpg"; imgUrl[7] = "画像/ ceshi.jpg"; 
title[1] = "テスト 1"; 
title[2] = "テスト 3"; "; 
 title[4] = "テスト 4"; 
title[5] = "テスト 5"; 
title[6] = "テスト 6"; 
title[7] = "テスト 5" 7"; 
説明 [1] = "説明 2"; 
説明 [3] = "説明 3"; 4] = "説明 4"; 
説明 [5] = "説明 6"; 
説明 [7] = "説明 7"; imgLink[1] = "ceshi1.asp"; 
imgLink[2] = "ceshi2.asp"; 
imgLink[4] = "ceshi4. asp"; 
imgLink[5] = "ceshi5.asp"; 
imgLink[6] = "ceshi6.asp"; 
imgLink[7] = "ceshi7.asp"; 

function showImage(){ 
$("#Buttons div").each(function(){ 
if($(this).attr("id") == "B" local ){ 
$(this).attr("class","Menu_On"); 
$(this).addClass("active"); 
$("#AdImage").attr(" src",imgUrl) [ローカル]); 
$("#AdTitle a").html(タイトル[ローカル]); 
$("#AdDescription a").html(説明[ローカル]); "#Images a").attr("href",imgLink[local]); 
}else{ 
$(this).removeClass("active"); "クラス","メニューオフ"); 
} 
if(ローカル > カウント){ 
ローカル = 1; = setTimeout(function(){showImage()},3000); 
} 

$("#Buttons div").click(function(){ 
local = $ (this). attr("id").replace("B",""); 
var cid = $(this).attr("id"); 
$("#Buttons div") .each(function) (){ 
if($(this).attr("id") == cid){ 
$(this).addClass("active"); 
$("# AdImage"). attr("src",imgUrl[$(this).attr("id").replace("B","")]); 
$("#AdTitle a").html( title[$( this).attr("id").replace("B","")]); 
$("#AdDescription a").html(description[$(this).attr(" id"). replace("B","")]); 
$("#Images a").attr("href",imgLink[$(this).attr("id").replace( "B", "")]); 
}else{ 
$(this).removeClass("active"); 
$(this).attr("class","Menu_Off"); 
}); 
window.clearInterval(theTimer); 
$("#Buttons div").mouseover(); if($(this).attr("id") != "トップ"){ 
$(this).css("カーソル","ポインタ") 
} 
 if($( this).attr("クラス") == "メニュー_オフ"){ 
$(この).attr("クラス","メニュー_オン") 
} 
}); "#Buttons div").mouseout(function(){ 
if($(this).attr("class") == "Menu_On"){ 
$(this).attr( "class", "Menu_Off"); 
} 
}); 



 次に CSS 部分: 




コードをコピー 


 コードは次のとおりです。 


body{ 
margin: 0px; 
パディング:0px; 
背景色:#FFFFFF; 
テーブル,th,tr,td,span,p{ 
フォントサイズ:9pt; } 
a:link{ 
color:#FFFFFF; 
text-decoration:none; 
a:visited{ 
color:#FFFFFF; :none; 
} 
a:active{ 

color:#FFFFFF;
text-decoration:none; a:hover{ color:# FF0000;
text-decoration:none;

} #Images{ position:relative; height:270px; 背景色:#FFFFFF; #タイトル{ 幅:100%;

下:0px; 🎜>背景色:#000000;

フィルター:alpha(opacity=40);
.Menu_On{
幅:15px; 18px;
背景色:#000000;
行の高さ:20px;
色:#FF0000;
>float:right;
幅:18px;
背景色:#000000;
行の高さ:20px; color:#FFFFFF;
#Top{
幅:47px;
背景色:#000000; :alpha(opacity=40,finishopacity=100,style=1,startx=0px,starty=18px,finishx=47px,finishy=18px);
}
#AdTitle{
padding-top :10px ;
padding-bottom:6px;
color:#FFFFFF;
padding-left:10px; 🎜>#AdDescription{
color:#FFFFFF;
padding-left:10px;
最後は HTML 部分：

复制代代码如下:

测试一下1

説明一下1

Imitation Thunder フォーカス広告効果 (JQuery 版)_jquery