自分のブログ(FC2)上部にJavaスクリプトを使い、自作のランダム画像&各画像にそれぞれ指定したリンクを貼りたいのですが、画像までは出来ましたがリンクの方法が分からず困っております。
Tool No.3 『画像ランダム表示スクリプト生成』
ttp://ssl.netlaputa.ne.jp/blg/tools/randimg.php
↑こちらのサイトで作成できる物のように動作させたいのですが、
上のサイトで作った物だと自分のブログでは表示が崩れて動作しませんでした。
自分なりに調べたところ、以下のコードだと画像は綺麗に表示されたのですが、
リンクはどうしたら出来るのかが分かりません。
なんとか以下のコードを改変して、リンクも付けられないでしょうか。
gehe2.jpgをクリックすると、gehe2.htmlに飛ぶというようにしたいです。
<SCRIPT LANGUAGE="JavaScript">
<!--
e = Math.floor(Math.random() * 6)
{
document.write('<style>')
if (e == 0) {
document.write('#header-text{background-image:url(http://www.hoge.com/hoge/gehe2.jpg);}')
}
else if (e == 1) {
document.write('#header-text{background-image:url(http://www.hoge.com/hoge/gehe3.jpg);}')
}
else if (e == 2) {
document.write('#header-text{background-image:url(http://www.hoge.com/hoge/gehe4.jpg);}')
}
else if (e == 3) {
document.write('#header-text{background-image:url(http://www.hoge.com/hoge/gehe5.jpg);}')
}
else if (e == 4) {
document.write('#header-text{background-image:url(http://www.hoge.com/hoge/gehe.jpg);}')
}
else {
document.write('#header-text{background-image:url(http://www.hoge.com/hoge/gehe3.jpg);}')
}
document.write('</style>;')
};
-->
</SCRIPT>
No.1ベストアンサー
- 回答日時:
質問者様の参考にされたURLのスクリプトには画像のサイズ指定がされていません。
この場合正しく画像が表示されないケースがあります。
以下のような感じで書けば出来るかと思うのですが…
出来なかったら申し訳ありません・・・
<SCRIPT language="JavaScript">
<!--
url = new Array();
img = new Array();
url[0] = "http://111111.com";
url[1] = "http://222222.com";
url[2] = "http://333333.com";
img[0] = "http://www.hoge.com/hoge/gehe1.jpg";
img[1] = "http://www.hoge.com/hoge/gehe2.jpg";
img[2] = "http://www.hoge.com/hoge/gehe3.jpg";
num = Math.floor(Math.random()*url.length);
document.write("<a href='"+url[num]+"'>");
//横幅と縦幅を指定する。画像によってサイズが違う場合は
//ここに対応するheight[],width[]等の配列をさくせいして下記行に組み込めばOK
document.write("<img src='"+img[num]+"' border='0' width='400' height='250'>");
document.write("</a>");
//-->
</SCRIPT>
うおおおおお出来ました!
形の崩れもなく、考えてた通りに動いてます。
どうしてもこの仕組みで配置したかったので、出来ずに腐っていたのが吹っ飛びました。
本当に助かりました。どうもありがとうございました!
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
似たような質問が見つかりました
- JavaScript 画像の表示位置 3 2022/12/23 08:25
- JavaScript clear機能を失わずにファイルアップロード機能を作成したい 3 2023/06/10 16:12
- HTML・CSS CSSが効かずどのように指定すれば良いか分からないのでアドバイスお願い致します 2 2023/06/07 12:25
- PHP PHP MySql 画像を取得 1 2022/06/04 14:05
- HTML・CSS 書籍を見つつサイト造りの練習をしているのですが、見た目が一致しません 2 2022/11/28 15:00
- C言語・C++・C# プログラミングのペーパーテスト 実行結果を表示せよ #include <stdio.h> int h 1 2022/07/09 15:27
- HTML・CSS ヘッダーの画像にメインエリアがかぶってしまいます 1 2022/11/28 14:06
- C言語・C++・C# プログラミングのペーパーテスト 実行結果がどのように表示されるか答えよ #include <stdi 1 2022/07/09 14:27
- JavaScript JavaScriptで「〇以上▲まで」の書き方 1 2022/07/20 14:44
- PHP imageフォルダに、画像をリサイズして保存する時のファイル名を変更したい 1 2023/05/30 11:39
関連するカテゴリからQ&Aを探す
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
コンマとクオーテーションマー...
-
『外部JSファイル』を呼び出し...
-
○歳△ヶ月と×日を計算してくれる...
-
window.openでタイトル名の指定
-
このスクリプトを修正したいの...
-
前のページに戻るとページトッ...
-
JavaScriptからFORMを生成でき...
-
JavaScriptだと思うのですが・・・
-
javaで画像をランダム表示しつ...
-
ランダムで文字を表示
-
google apps scriptの終了のさせ方
-
Boolean型配列中のTrueの有無を...
-
同じIDで定義した要素の配列を...
-
文字を一文字ずつ表示
-
C#OpenCv V4にのエラーに関する...
-
XMLでのAttributeを持ったNode...
-
1日1回引けるJavaScriptおみく...
-
<a>タグのテキストを取得
-
ジェネレーターの作り方
-
functionから別のfunctionを実...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
window.openでタイトル名の指定
-
ホームページに日付を自動更新...
-
なぜ、ジャバスクリプトが表示...
-
○歳△ヶ月と×日を計算してくれる...
-
今日の月と日付の1週間後や3日...
-
javascriptとphpの連携で疑問
-
引数を渡さずに呼び出し元の変...
-
document.clear()の使い方について
-
document.writeで画面が消える
-
文字列を点滅させたい
-
java カレンダーの日付指定で...
-
Java Scriptのメソッドについて
-
面白い!便利!と思った【JavaS...
-
javaで画像をランダム表示しつ...
-
ウェブ上にキーボードを作りた...
-
JavaScriptで前月を算出する方法
-
document.writeについて
-
for文のiを使ってリンク先のア...
-
外部JavaScriptでのd...
-
前のページに戻るとページトッ...
おすすめ情報