2016-05-05 12 views
0

ランダムな画像とテキストを開くためのWebページを取得しようとしています。私はこれを使って、図書館のフロントページに異なるイベントを掲載します。ウェブ上のさまざまな例から抜け出す私は、これでうまく動作するための基礎を得ました。ランダムなテキストと画像のスクリプトにスタイル/フォントを追加しようとしています

var total_images = 2; 
    var random_number = Math.floor((Math.random()*total_images)); 
    var random_img = new Array(); 
    var random_text = []; 

    random_img[0] = "<a href = 'www.webpage.com'><img src='image_1.jpg' alt='Image'></a>"; 
    random_text[0] = "<p>Here is some text</p>";  

    random_img[1] = "<a href = 'www.webpage2.com'><img src='image_2.jpg' alt='Image2'></a>"; 
    random_text[1] = "<p>Here is some text2</p>"; 

    document.write(random_img[random_number] + ' <br/><p id="myP">' + random_text[random_number] + 'dfsadf</p>'); 

function myFunction() { 
    document.getElementById("myP").style.font = "italic bold 20px arial,serif"; 
} 

これは期待どおりに機能し、更新時に新しいイベントの画像とテキストが表示されます。私が問題を抱えているのは、私たちのウェブページの残りの部分とスタイルを一致させることができないということです。私は関数を使って新しいid、通常のhtmlタグを作成しようとしました。私がいつも<b>または<i>よりも何かをrandom_text[] = "<p>codehere</p>";に追加すると、ページが壊れます。

フォントを一致させると完全に変えることができます。

+0

「それはページを壊す」を定義してください。 –

+0

ページが空白になります。 –

答えて

0

<p>タグを別の<p>タグの中に入れないでください。文書の書き込みのためにこれを試してみてください:

document.write('<div id="myP">' + random_img[random_number] + ' <br/>' + random_text[random_number] + 'dfsadf</div>'); 

とフォントは、あなたのHTMLページにCSSを使用して変更することができます。

<style type="text/css"> 
    #myP p { font:20px arial,sans-serif; } 
</style> 
+0

ありがとう! p、h1、h2を使ってCSSを追加すると、フォントを変更できます。 –

+0

ニース、それはすべての問題を解決した場合多分私の答えを受け入れることができます:) – M4tini

関連する問題