人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

fc2ブログのTOPの画像をランダムで
変更させたいのです。
HTML 部分の記述に
<body>
<div id="baseBlock">
<a name="page_top"></a>
<!--headBlockBase-->
<div id="headBlockBase">
<!--headBlock-->
<div id="headBlock">

とあり、今載せている画像は
#baseBlock {
width: 950px;
margin: 0px auto;
padding: 0px;
background-color: #000000;
background: url(http://blog107.fc2.com/n/nakane2007/file/001.jpg) no-repeat #000000;

に記載されています。

この書き換えをJavaScriptでやるなら
JavaScriptの
document.write以下は
どう書き出すのがいいのでしょう。
この場合スタイルシートには書き出せないのですよね?
そうすると、スタイルシートの部分を
消してHTML部分にJavaScriptを
いれて書くと言うことになりますか。
その場合、どこを消して、どう書き出せばいいか、サンプルをお願いします。


●質問者: nakane2007
●カテゴリ:コンピュータ ウェブ制作
✍キーワード:#000000 background background-color FC2ブログ JavaScript
○ 状態 :終了
└ 回答数 : 2/2件

▽最新の回答へ

1 ● オーイェー
●35ポイント
document.getElementById("baseBlock ").style.background 

もしくは、prototype.jsを利用して

$("baseBlock ").style.background

とかでできると思います。

FC2ではないですが、参考までに、

以下のアドレスでちょっとやってみました。

http://www5.pf-x.net/~ohyeah/bin/soft/bg.shtml

↓js

http://www5.pf-x.net/~ohyeah/bin/soft/js/bg.js

↓css

http://www5.pf-x.net/~ohyeah/bin/soft/css/bg.css

◎質問者からの返答

すみません、もうすこし教えて下しさい。

たとえば、ランダムに画像ファイルを設定するために (以下参考に持ってきたスクリプト)

<script language="JavaScript"> </p> <p><!-- </p> <p>ranimg = new Array(); </p> <p>ranimg[0]="<a href="http://blog2.fc2.com/n/nakane2007/file/01.jpg" target="_blank">http://blog2.fc2.com/n/nakane2007/file/01.jpg</a>"; </p> <p>ranimg[1]="<a href="http://blog2.fc2.com/n/nakane2007/file/02.jpg" target="_blank">http://blog2.fc2.com/n/nakane2007/file/02.jpg</a>"; </p> <p>ranimg[2]="<a href="http://blog2.fc2.com/n/nakane2007/file/03.jpg" target="_blank">http://blog2.fc2.com/n/nakane2007/file/03.jpg</a>"; </p> <p>xx = Math.floor(ranimg.length*Math.random()); </p> <p>ranimg = ranimg[Math.floor(xx)]; </p> <p>document.write ('<style type="text/css"><!--#box_title {background-image: url("'+ ranimg +'");}--></style>'); </p> <p>// --> </p> <p></script>

を使いたい場合、

document.write ('<style type="text/css"><!--#box_title {background-image: url("'+ ranimg +'");}--></style>');

の部分を

document.getElementById("baseBlock ").style.background

を使ってどう変えたらいいのでしょう。

よろしくお願いします。


から何を足せば


2 ● オーイェー
●35ポイント

では、ちょっとした

修正です。

まず、私の回答

document.getElementById("baseBlock ").style.backgroundは

#baseBlockのスタイルシートを直接書き換える方法でした。

が、document.writeで

直接スタイルシートを書き出したいということですので、

その方向で、再度回答いたします。

ロジックを拝見すると、↓のようなスタイルシートを

書き出そうとされているのかなぁと思いました。

<style type="text/css">
<!--
#box_title {
background-image: url("<a href="http://blog2.fc2.com/n/nakane2007/file/02.jpg" target="_blank">http://blog2.fc2.com/n/nakane2007/file/02.jpg</a>
;}
-->
</style>

ただ、

JavaScriptにいくつかバグがあるように思えたので、

そのあたりを簡単に修正してみました。

ranimg = new Array(); 
ranimg[0]='http://blog2.fc2.com/n/nakane2007/file/01.jpg'; 
ranimg[1]='http://blog2.fc2.com/n/nakane2007/file/02.jpg';
ranimg[2]='http://blog2.fc2.com/n/nakane2007/file/03.jpg';
xx = Math.floor(ranimg.length * Math.random());
document.write ('<style type="text/css"><!--#box_title {background-image: url("'+ ranimg[xx] +'");}--></style>');

↑ということで、どうでしょうか?

◎質問者からの返答

すこしやってみます。

FC2のHTML欄に書き込むとエラーがでるので

なぜか分かりません。

うまく行かないときは質問を再度上げますので

よろしくお願いします。

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ