- 締切済み
スライドショー
初めまして、ちゃりおと申します。 JavaScript初心者です。 あるページに静止画（.jpg）が３枚あって、それらをクリックするとアニメGIFにきりかわってスライドショーが始まる、という簡単なスクリプトをつくってみました。 ただ、これだと静止画の数が増えた場合に保守効率が悪くなってしまいます。JavaScriptを使うにしても、同じ機能を実現するためにもっとスマートな方法はないものでしょうか？ 諸先輩方、お知恵をおかしください。 //スクリプトここから <html> <head> <title>slideshow</title> <script language="javascript"> <!-- function autoslide_aisa(){ document.n_aisa.src = "img/aisa_anime.gif"; } function autoslide_ann(){ document.n_ann.src = "img/ann_anime.gif"; } function autoslide_mipori(){ document.n_mipori.src = "img/mipori_anime.gif"; } // --> </script> </head> <body BGCOLOR="#FFFFFF"> <table border="0" cellpadding="0" cellspacing="0" width="80%" align="center"> <tr> <td align="center" valign="bottom"> <a href="javascript:autoslide_aisa()"><img src="img/aisa1.jpg" name="n_aisa" border="0" align="bottom"> </a> </td> <td align="center"> <a href="javascript:autoslide_ann()"><img src="img/ann1.jpg" name="n_ann" border="0"> </a> </td> <td align="center"> <a href="javascript:autoslide_mipori()"><img src="img/mipori1.jpg" name="n_mipori" border="0"> </a> </td> </tr> </table> </body> </html> //スクリプトここまで
- chaz
- お礼率65% (36/55)
- JavaScript
- 回答数2
- ありがとう数1
- みんなの回答 （2）
- 専門家の回答
みんなの回答
- sight
- ベストアンサー率53% (199/370)
私自身、JavaScript修めたわけじゃないので、心苦しいのですが（＾＾； 関数がまとまったという意味ではいいのではないでしょうか？ ただ、ファイルの名前にそれほど理由がなければ引数一つでもいいような・・・ function autoslide(name){ document.images[name].src = 'img/' + name + '.gif'; } のように。 ただ、n_asiaなどのn_はname属性のn_、という意味を与えているみたいですからいやですかね。 あと、アンカータグの中でのJavaScriptの呼び出しですが、href属性に書いて大丈夫なのでしょうか？ 自分はやったことないのでちょっと怖いな、と思っています。 私だったら、 <a href="javascript:void(0);" onClick="javascript:autoslide('n_ann');"> <img src="img/ann1.jpg" name"n_ann" border="0"> </a> って感じで。
- sight
- ベストアンサー率53% (199/370)
これだと、画像が増えれば増えるだけ新しいfuncitionを作ることになりますよね？ ・funcitionは一つにまとめて、ファイル名は引数で渡す（と、いうか、ほかのファイルと異なるasiaとかannとかいうところだけ引数にて渡す） ・funcitionは一つにまとめて、ファイルの命名規則を番号にして、引数としては番号だけ渡す ・funcitionは一つにまとめて、アニメGIFファイル名は配列に格納して、引数としては番号だけ渡す こんなところでどうでしょ？
補足
いろいろ調べて、じゃっかんですが、以下のように改良してみました。 まだ改良の余地ありでしょうか？？？ //ここから <html> <head> <title>slideshow</title> <script language="javascript"> <!-- function autoslide(name,src){ document.images[name].src = src; } // --> </script> </head> <body BGCOLOR="#FFFFFF"> <table border="0" cellpadding="0" cellspacing="8" width="80%" align="center"> <tr> <td align="center" valign="bottom"> <a href="javascript:autoslide('n_aisa','img/anime_1.gif')"><img src="img/aisa1.jpg" name="n_aisa" border="0" align="bottom"> </a> </td> </tr> <tr> <td align="center"> <a href="javascript:autoslide('n_ann','img/anime_2.gif')"><img src="img/ann1.jpg" name="n_ann" border="0"> </a> </td> </tr> <tr> <td align="center"> <a href="javascript:autoslide('n_mipori','img/anime_3.gif')"><img src="img/mipori1.jpg" name="n_mipori" border="0"> </a> </td> </tr> </table> </body> </html> //ここまで
関連するQ&A
- 写真の下に説明文
こんにちは。 今アルバムのページを作っています。 右側に縮小した写真を縦に並べ、その写真をクリックすると画面中央に拡大されて映るというものです。 拡大された時、写真の簡単な説明文を写真の下に表示させたいんですが、やり方がわかりません。検索してみたんですが、それらしき物が見つからずこちらに参りました。 だいぶ略してますが、下記のようなソースを使って作りますよね？これで、中央に表示させるまでは出来ました。後は各写真の説明文の表示だけなんです。 <script type="text/javascript"> <!-- var img01 = "../photoothers/stamp.jpg"; function startimg(I){ document.image.src=I; } //--> </script> ＝中略＝ <table> <tr> <td align=center> <table border =1> </td> </tr> <tr> <td align=center> <img src="../gif/●.jpg" name="image"> </td> </tr> </table> </td> <td> <table align=right"> <tr> <td align=center> <a href="javascript:startimg(img01)"> <img src="../gif/●.jpg" width="130" height="100"></a> </td> </tr> </table> </td> </tr> </table> 宜しくお願いします。
- ベストアンサー
- レンタルサーバ・ASP
- 画像のサムネイルを縦横ともに指定した数値以内で表示したい。
いままで画像を縦横比を維持して表示するには、縦一方の大きさを指定してたのですが これだと横長の画像を多く並べる場合デザインが大きく狂ってしまいます…。（どんどん横に広がってしまいます） googleやpixivのように縦横整えて表示させたいのですが、やり方が分かりません。どのようにすればよいのでしょうか。 イメージとしてはこんな感じです。 ・130ピクセルx130ピクセルの枠の中に縦横比を維持した画像を表示させる。 ・その枠を横に四つ並べる。 （縦長の画像は極端に縦長に表示され、横長の画像は極端に横長に表示されるということです。） 各画像の表示例は、例えばgoogle画像検索やpixivなど。 →google画像検索 http://images.google.co.jp/images?hl=ja&safe=off&q=%E3%83%91%E3%83%8E%E3%83%A9%E3%83%9E&lr=&um=1&ie=UTF-8&sa=N&tab=wi →pixiv http://www.pixiv.net/search.php?word=%E6%BC%AB%E7%94%BB&s_mode=s_tag ---いままで使ってたソース--- <table width="80%"> <tr align="center"> <td><a href="001.jpg"><img src="001.jpg" border="0" height="130"></a></td> <td><a href="002.jpg"><img src="002.jpg" border="0" height="130"></a></td> <td><a href="003.jpg"><img src="003.jpg" border="0" height="130"></a></td> <td><a href="004.jpg"><img src="004.jpg" border="0" height="130"></a></td> </tr> <table width="80%"> <tr align="center"> <td><a href="005.jpg"><img src="005.jpg" border="0" height="130"></a></td> <td><a href="006.jpg"><img src="006.jpg" border="0" height="130"></a></td> <td><a href="007.jpg"><img src="007.jpg" border="0" height="130"></a></td> <td><a href="008.jpg"><img src="008.jpg" border="0" height="130"></a></td> </tr> ---ここまで--- こんなソースを使ってました。 教えてください、よろしくお願いします。
- ベストアンサー
- HTML
- 「戻る」「進む」ボタンで画像を変えるには？
「戻る」「進む」ボタンで5枚の画像を変えられるようにしたいのですが、なかなかできません。 順番が飛んでしまったりしてしまいます。 var n=0; var imgDB=new Array("kenkyu/0.jpg","kenkyu/1.jpg","kenkyu/2.jpg","kenkyu/3.jpg","kenkyu/4.jpg"); function change(){ if(n==0)n=4; if(n==5)n=0; document.img.src=imgDB[n]; } <TABLE cellpadding="10" bgcolor="#0099cc"> <TBODY> <TR> <TD><IMG src="kenkyu/0.jpg" name="img" width="500" height="400" border="0"></TD> </TR> </TBODY> </TABLE> <A href=JavaScript:n--;change();><IMG src="kenkyu/modoru.jpg" width="96" height="28" border="0"></A> <A href=JavaScript:n++;change();><IMG src="kenkyu/susumu.jpg" width="96" height="28" border="0"></A><BR> 分かる方、教えて下さい。 よろしくお願い致します。
- ベストアンサー
- JavaScript
- 文字をオンマウスすると、画像がかわり、クリックで他のページへいくようにしたい。
初めてJavaを使いました。 『文字にマウスを当てると、上に置いた画像がかわり、さらにその文字をクリックすると、他のページにいくようにしたいのです』 文字にマウスを当てると、上に置いた画像が変わるとこまではできましたが、どうしても他のページへのリンクができません。 よい方法を教えてください。 作ったHTMLは以下のとおりです。 <SCRIPT language="JavaScript"><!-- function myChgPic(myPicURL){ document.images["myBigImage"].src = myPicURL; } // --></SCRIPT> <TABLE align="center"> <TBODY> <TABLE border="0" align="center"> <TBODY> <TR> <TD><IMG src="ankor.jpg" name="myBigImage" border="2"></TD> </TR> <TR> <TD><A href="javascript:void(0)" onmouseover="myChgPic('shanghai.jpg')">上海 <br> <A href="javascript:void(0)" onmouseover="myChgPic('italy.jpg')">イタリア <br> <A href="javascript:void(0)" onmouseover="myChgPic('canada.jpg')">カナダ </A> </TD> </TR> </TBODY> </TABLE> 上海、カナダ、イタリアという文字をクリックしたら、その写真にかわり、文字をクリックしたらそれぞれのページにリンクさせたいのです。
- 締切済み
- JavaScript
- aaa!cafeにて
リンクが表示されないのです。 <html> <body bgcolor="black" link="red" vlink="glay"> <font color="white"> <title>リンク</title> <table align="center"> コメント </table> </p> <hr> <table border="1" width="90%" align="center"> <STYLE TYPE="text/css"> <!-- td{ color: white; } --> </STYLE> <tr> <td colspan="3" align="center"><font color="yellow">コメント</font></td> </tr> <tr> <td align="center"><img src="link_banner/search_the_bass.jpg"></td><td align="center"><a href="アド">サイト</a></td> <td>コメント</td> <tr> <td align="center"><img src="link_banner/fun.gif"></td><td align="center"><a href="アド">サイト</a></td> <td></td> </tr> <tr> <td colspan="3" align="center"><font color="aqua">お役立ちサイト</font></td> </tr> <tr> <td align="center"><img src="link_banner/manbo_bass.gif"></td><td align="center"><a href="http://degu.***.org/ranking/bass/autorank/rankem.cgi?action=in&id=sunsurf" target="_new">Bass Site Ranking</a>ココが表示されません</td> <td>コメント</td> </tr> <tr> <td align="center"><img src="link_banner/nanikiru_s5.gif"></td><td><a href="http://www.***.net/">なにきる．ねっと</a></td> <td>コメント</td> </tr> </table> </body> </html> ココが表示されません、というとこなんです。<a href～がサーバにアップすると消えるんです。 悩みの種です・・・。よろしくお教えください！
- ベストアンサー
- レンタルサーバ・ASP
- スライドショーについて
ど～もど～も。よろしくです。http://okwave.jp/qa5423914.html 上のURLでの質問はjQueryじゃなくて「TinySlideshow」ってやつだったんだけど、jQueryだったらどうなるのかな？ 私も同じような設計で悩んでてピッタシと思うのがやっとあった！と思ってたら・・・jQueryじゃないみたい（泣） 私のしたいことはjQueryを使ったスライドショーで、時間によって色んな画像がころころと変わるようなものを作りたいです。 ソースを貼っておくのでよろしくお願いします。 ｈｔｍｌファイル <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd"> <!-- saved from url=(0051)http://www.frontstyle.com/shopcruise/tokyo_009.html --><HTML xmlns="http://www.w3.org/1999/xhtml"> <HEAD><TITLE>test</TITLE><META content="text/html; charset=utf-8" http-equiv=Content-Type><META content=IE=7 http-equiv=X-UA-Compatible><!--css--> <LINK rel=stylesheet type=text/css href="css/style.css"> <LINK rel=stylesheet type=text/css href="css/ie6.css"> <LINK rel=stylesheet type=text/css href="css/backnumber.css"> <LINK rel=stylesheet type=text/css href="css/lightview.css"> <LINK rel=stylesheet type=text/css href="css/shopcruise.css"> <!--js--> <SCRIPT type=text/javascript src="js/heightLine.js"></SCRIPT> <SCRIPT type=text/javascript src="js/jquery-1.3.2.js"></SCRIPT> <SCRIPT type=text/javascript> jQuery.noConflict(); </SCRIPT><SCRIPT type=text/javascript src="js/jquery.easing.1.3.js">/SCRIPT> <SCRIPT type=text/javascript src="js/jquery.galleryview-1.1.js"></SCRIPT><SCRIPT type=text/javascript src="js/jquery.timers-1.1.2.js"></SCRIPT><SCRIPT type=text/javascript> jQuery(document).ready(function(){jQuery('#slide').galleryView({ panel_width: 638,panel_height: 300,frame_width: 80,frame_height: 38,transition_interval: 3000,overlay_height: 0 });}); </SCRIPT> <!--[if lt IE 7]><script type="text/javascript" src="js/iepngfix.js"></script><![endif]--> <SCRIPT type=text/javascript src="js/heightLine.js"></SCRIPT> <SCRIPT type=text/javascript src="js/swapimage.js"></SCRIPT> <SCRIPT type=text/javascript src="js/prototype.js"></SCRIPT> <SCRIPT type=text/javascript src="js/scriptaculous.js"></SCRIPT> <SCRIPT type=text/javascript src="js/lightview.js"></SCRIPT> <!--//js--></HEAD><BODY><DIV id=slide class=galleryview> <!--スライドショーここからだよ--> <DIV id=gallery_box> <!--メイン画像ここからだよ--> <DIV class=panel><IMG alt="○○○ src="./images/1.jpg" width=640 height=300> </DIV> <DIV class=panel><IMG alt="○○○" src="./images/2.jpg" width=640 height=300> </DIV> <DIV class=panel><IMG alt="○○○" src="./images/3.jpg" width=640 height=300> </DIV> <DIV class=panel><IMG alt="○○○" src="./images/4.jpg" width=640 height=300> </DIV> <DIV class=panel><IMG alt="○○○" src="./images/5.jpg" width=640 height=300> </DIV> <DIV class=panel><IMG alt="○○○" src="./images/6.jpg" width=640 height=300> </DIV> <DIV class=panel><IMG alt="○○○" src="./imagess/7.jpg" width=640 height=300> </DIV> <!--メイン画像ここまでだよ--> <!--メイン画像ここまでだよ--><!--サムネイルここからだよ--> <UL class=filmstrip> <LI><IMG alt="アバハウス・ドゥヴィネット リュクス" src="./images/image_tokyo_009_7s.jpg"> <LI><IMG alt="アバハウス・ドゥヴィネット リュクス" src="./images/image_tokyo_009_2s.jpg"> <LI><IMG alt="アバハウス・ドゥヴィネット リュクス" src="./images/image_tokyo_009_3s.jpg"> <LI><IMG alt="アバハウス・ドゥヴィネット リュクス" src="./images/image_tokyo_009_4s.jpg"> <LI><IMG alt="アバハウス・ドゥヴィネット リュクス" src="./images/image_tokyo_009_5s.jpg"> <LI><IMG alt="アバハウス・ドゥヴィネット リュクス" src="./images/image_tokyo_009_6s.jpg"> <LI><IMG alt="アバハウス・ドゥヴィネット リュクス" src="./images/image_tokyo_009_1s.jpg"> </LI></UL><!--サムネイルここまでだよ--> </DIV><!--スライドショーここまでだよ--> </DIV></BODY></HTML> 長くなっちゃってごめんなさい。 困っているので、お願いします。
- 締切済み
- JavaScript
- 下記が私のHPのタグなのですが
文字化けをしてしまいます。 タグは文字制限を超えるため、これで全部ではありませんが、 文字化けの原因はどこにあるのでしょうか？ 編集のプレビュー等では文字化けせず表示されますが、 アップすると、文字化けしてしまうのです。 下記はアップした後、右クリックでソースをコピーしたものです。 文字化けの原因をお教え願います。 よろしくお願い申し上げます。 <HTML> <HEAD> <META name="GENERATOR" content="IBM HomePage Builder 2001 V5.0.0 for Windows"> <TITLE></TITLE> </HEAD> <BODY><!-- geoguide start --><div align=center><script language="JavaScript">var jps=382116062;var jpt=1379958019</script><script language="JavaScript" src="http://bc.geocities.yahoo.co.jp/js/gg.js"></script></div><!-- geoguide end --><!-- geoguide start --><div align=center><script language="JavaScript">var jps=382116554;var jpt=1379847951</script><script language="JavaScript" src="http://bc.geocities.yahoo.co.jp/js/gg.js"></script></div><!-- geoguide end --><DIV ALIGN=CENTER><!--#geoguide--></DIV> <TABLE width="734" height="112"> <TBODY> <TR> <TD height="81" width="116" bgcolor="#33FF00" align="left"><IMG src="im/Scome.gif" width="114" height="79" border="0"></TD> <TD height="81" width="602" bgcolor="#33FF00"><IMG src="im/midasi.jpg" width="600" height="80" border="0"></TD> </TR> </TBODY> </TABLE> <TABLE align="left"> <TBODY> <TR> <TD width="115" valign="top" bgcolor="#FFFFFF" height="601"><FONT size="3"><img src="@geocounter"><BR> <BR> <IMG src="im/M04_01.gif" width="13" height="13" border="0"><B><FONT color="#000000"><A href="col5/whatsnew.html"><FONT color="#000000">what's new</FONT></A></FONT></B><B><BR> <A href="col1/profile.html"><FONT color="#000000"><IMG src="im/M04_01.gif" width="13" height="13" border="0">・ラ・愠ユ・」。シ・</FONT></A><BR> </B><B><A href="col3/new.html"><FONT color="#000000"><IMG src="im/M04_01.gif" width="13" height="13" border="0">ツミタ�ョタモ</FONT></A></B><B><BR> <A href="col2/member.html"><FONT color="#000000"><IMG src="im/M04_01.gif" width="13" height="13" border="0">・皈ミ。シセメイ</FONT></A><BR> </B></FONT><FONT size="2"><B><FONT color="#000000" face="」ヘ」モ 」ミフタトォ"><IMG src="im/M04_01.gif" width="13" height="13" border="0"></FONT></B></FONT><FONT size="3"><B><FONT color="#000000" face="」ヘ」モ 」ミフタトォ">・ョ・罕鬣遙シ</FONT></B></FONT><BR> <IMG src="im/M04_01.gif" width="13" height="13" border="0"><FONT size="2" color="#000000"><FONT color="#000000" size="3"><B>ナキオ、ヘスハ<BR> </B></FONT></FONT><FONT size="2" color="#000000"><A href="http://www.wni.co.jp/cww/docs/yoho/s12.html"><FONT color="#000000"><!-- begin webleague Link --></FONT></A><A href="http://www.webleague.net/teamdb.html"><IMG src="http://www.webleague.net/teamlink/images/teamlink01.jpg" border="0"></A><A href="http://www.okaten.com/baseball/index.html"><FONT color="#000000"> <!-- end webleague Link --></FONT></A></FONT><BR> <IMG src="im/ten-bun.gif" border="0"><BR> <A href="mailto:manesitana@ybb.ne.jp"><IMG src="im/fingermail.gif" width="77" height="20" border="0"></A><BR> <B><A href="http://www2.g-7.ne.jp/~yakyu/index.shtml"><FONT color="#00CCCC">チ鋙蠕ノ</FONT></A></B><BR> <A href="col2/fuso.html"><IMG src="im/fuso.jpg" width="112" height="20" border="0"></A><BR> <B><FONT size="2" color="#99CC00">ナミサウイネ<BR> </FONT><FONT size="2" color="#666666">ウーナ�</FONT></B><BR> <FONT color="#666666"><B>car doctor<BR> </B></FONT><FONT color="#666666" size="2"><B>・「・ム・�</B></FONT></TD> </TR> </TBODY> </TABLE> <TABLE width="618" height="388"> <TBODY> <TR> <TD align="left" valign="top" width="420"> <TABLE> <TBODY> <TR> <TD valign="top" height="150" width="208" align="center"><IMG src="im/allspirits.jpg" width="203" height="146" border="0"></TD> <TD height="150" width="196" valign="top" align="left" bgcolor="#FFCC00"><A href="butting.html"><FONT color="#000000">「」イハウリ、ケ、�鋙蝪ハツヌキ筍ヒ<BR> <SPAN style="FONT-SIZE: 9.5pt; COLOR: black; FONT-FAMILY: '」ヘ」モ フタトォ'; mso-hansi-
- ベストアンサー
- HTML
- 2箇所に設定したスライドショー、1箇所しか動かない
こんにちは、JavaScript超初心者です。 スライドショーを2箇所に設定したのですが、 1箇所しか動きません。ソースを見ていただき、 アドバイスを頂けると助かります。 よろしくお願い致します。 <BODY onLoad="slideshow()"> <TABLE WIDTH="" BORDER="" CELLSPACING="" CELLPADDING=""> <TBODY> <TR> <TD WIDTH="" HEIGHT=""> <IMG SRC="akaemi.jpg" ID="img1" WIDTH="" HEIGHT=""> </TD> <SCRIPT LANGUAGE="JavaScript"> <!-- var i=1; var j=1; picture=new Array(); for(i=1; i<=4; i++){ picture[i] = new Image(); }; picture[1].src = "akaemi.jpg"; picture[2].src = "noristop2.jpg"; picture[3].src = "ume.jpg"; picture[4].src = "mizuba.jpg"; function slideshow(){ img1.src= picture[j].src; j++; if(j>=5){ j=1 }; setTimeout("slideshow()",2500); } //--> </SCRIPT> <TD WIDTH="" HEIGHT=""> <IMG SRC="tyou1.jpg" ID="img2" WIDTH="" HEIGHT=""></TD> <SCRIPT LANGUAGE="JavaScript"> <!-- var i=5; var j=5; photo=new Array(); for(i=5; i<=8; i++){ photo[i] = new Image(); }; photo[5].src = "tyou1.jpg"; photo[6].src = "tyou2.jpg"; photo[7].src = "tyou3.jpg"; photo[8].src = "tyou4.jpg"; function slideshow(){ img2.src= photo[j].src; j++; if(j>=9){ j=5 }; setTimeout("slideshow()",2500); } //--> </SCRIPT> </TR> </TBODY> </TABLE> </BODY>
- ベストアンサー
- JavaScript
- スライドショーに妙な間がある。
いつも為になるアドバイスありがとうございます。 HP作成してるなかで気になったことがあるのですが、jQueryでスライドショーを設定して 画像からリンクを設定すると妙な間があって気になります。 原因は何でしょうか？ ご指導願います。 HTMLフォーム <!DOCTYPE html><!----> <html> <head> <meta charset="utf-8"> <title>ファッション通販サイト”Ce qui plait aux fill”</title> <style>/*CSS*/</style> <link rel="stylesheet" href="top.css" type="text/css" media="all"> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script type="text/javascript"> $(function(){ $('.fadein img:gt(0)').hide(); setInterval(function() { $('.fadein :first-child').fadeOut() .next('img').fadeIn() .end().appendTo('.fadein'); }, 3000); }); </script> <link rel="stylesheet" href="top.css" type="text/css" media="all"> </head> <body> <div id="wrapper"> <div class="header"> <h1 class="logo"><img src="img/top-logo-01.jpg" /></h1> </div><!--header--> <div class="section"> <div class="fadein"> <a href="リンク01.html"><img src="画像01.jpg" width="400px" height="auto" /></a> <a href="リンク02.html"><img src="画像02.jpg" width="400px" height="auto" /></a> <a href="リンク03.html"><img src="画像03.jpg" width="400px" height="auto" /></a> <a href="リンク04.html"><img src="画像04.jpg" width="400px" height="auto" /></a> <a href="リンク05.html"><img src="画像05.jpg" width="400px" height="auto" /></a> <a href="リンク06.html"><img src="画像06.jpg" width="400px" height="auto" /></a> <a href="リンク07.html"><img src="画像07.jpg" width="400px" height="auto" /></a> <a href="リンク08.html"><img src="画像08.jpg" width="400px" height="auto" /></a> <a href="リンク09.html"><img src="画像09.jpg" width="400px" height="auto" /></a> <a href="リンク10.html"><img src="画像10.jpg" width="400px" height="auto" /></a> <a href="リンク11.html"><img src="画像11.jpg" width="400px" height="auto" /></a> </div><!--fadein--> </div><!--section--> <div class="img"> <p><img src="img/waku.jpg" /></p> </div><!--img--> <div class="news"> <div class="new-item"> <p><img src="img/new-item.jpg" /></p> </div><!--new-item--> </div><!--news--> <div class="item-menu"> <p>最新のアイテムを紹介します。</p> <ul> <li><a href="#">サンダル</a></li> <li><a href="#">パンプス</a></li> <li><a href="#">タンクトップ</a></li> <li><a href="#">キュロット</a></li> <li><a href="#">スカート</a></li> <li><a href="#">ウェッジソール</a></li> <li><a href="#">トレンチコート</a></li> <li><a href="#">カーディガン</a></li> <li><a href="#">ルームウェア</a></li> <li><a href="#">バック</a></li> </ul> </div><!--item-menu--> <div id="footer"> <ul> <li><a href="#">TOP</a></li> <li><a href="#">リンク</a></li> <li><a href="#">サイトマップ</a></li> <li><a href="#">お問い合わせ</a></li> </ul> </div><!--footer--> </div><!--wrapper--> </body> </html> CSSフォーム @charset"utf-8"; body{ width:100%; background: #EDE8EA url(img/dot/14.gif) repeat; } body .fadein { position:relative;} .fadein img { position:absolute; left:20px; top:35px; } #wrapper{ margin:auto; width:980px; } .header{ width:980px; padding:0; border: 10px groove #cfc; background:#fff; } .section{ margin:30px 0 0; } .img{ float:left; } .news{ float:left; margin:20px; background:#fff; width:500px; border-radius: 10px; } .new-item{ text-align: center; margin:20px 0 0 0; } .item-menu{ float:left; margin:0 20px; font-size:30px; } .item-menu li{ font-size:24px; background-color:#fff; width:300px; list-style:none; text-align:center; margin:5px; } .item-menu a{ text-decoration:none; } .item-menu li:hover{ text-decoration:underline; background-color:#ADFF2F; } #footer{ clear: both; }
- ベストアンサー
- HTML
- アクセスカウンタのタグを貼り付ける？？
無料を謳っているのに、クレジットカードなどと心配な語句が有ります。 どのようなことを書いてあるのか教えてください。 ちなみに、使用は止めて居ます。 <!--タグはここから--><table border="0" cellspacing="0" cellpadding="0"><tr><td align="center"><a href="http://www.rays-counter.com/"><img src="http://www.rays-counter.com/d144_f6_022/4f17b2e7e4b99/" alt="アクセスカウンター" border="0"></a></td></tr><tr><td align="center"><a href="http://goods-fun.net/"><img src="http://www.rays-counter.com/images/counter_01.gif" border="0" alt="GoodsFun-グッズファン"></a><a href="http://www.e-creditcard.info/"><img src="http://www.rays-counter.com/images/counter_02.gif" border="0" alt="クレジットカード比較"></a><a href="http://fx-ch.com/"><img src="http://www.rays-counter.com/images/counter_03.gif" border="0" alt="FX比較サイト"></a><img src="http://www.rays-counter.com/images/counter_04.gif" border="0"><a href="http://engagement-r.net/"><img src="http://www.rays-counter.com/images/counter_05.gif" border="0" alt="婚約指輪サーチ"></a></td></tr></table><!--ここまで-->
- ベストアンサー
- スパイウェア
お礼
<a href="javascript:void(0);" onClick="javascript:autoslide('n_ann');"> こういうやり方があるんですね。 知りませんでした（＾＾；；； いや、大変参考になりました。 ありがとうございます。