質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

解決済

3回答

3602閲覧

JavaScriptで月ごとに背景画像を切り替えたいです。

marcom

総合スコア5

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

0クリップ

投稿2019/10/01 06:18

編集2019/10/01 06:56

ウェブサイトを作っているのですが

JavaScriptで月ごとに背景画像を切り替えたいです。

例えば、クラスで指定した背景画像background-imageを
1ヶ月ごと、月の頭に自動で切り替えたいのですが
全くの初心者でうまく行かなく困っております

基本的なことかと思いますがどなたか教えていただけないでしょうか?
どうぞよろしくお願いします。

追記

回答ありがとうございます、不慣れななかお手数おかけしました。
現状は

<script> <!-- function pic_change(){ d=new Date(); month=d.getMonth()+1; document.write('<.monthp background="img/back/' + month + '.jpg">'); } pic_change(); //--> </script>
<section class="monthp"> ///略/// </section>

でして、monthpの背景画像を変更したいのですが
1〜12.jpgの画像は用意してます。
document.write('<.monthp background="img/back/' + month + '.jpg">');
のmonthpじゃなくてbodyなら読み込んで来てくれるんですが、色々調べたのですが、
書き方が全くわかっていませんで...

どうぞよろしくお願いします。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

miyabi_takatsuk

2019/10/01 06:24

ご自身で、どこまで調べ(参考にしたページがあるならそのページのURL)、やってみたか(自身で書いてみたソースコード)を、質問本文に載せてください。(このコメント欄ではなく、質問本文を編集して載せる) 今のままではやりたいことをやってくれという丸投げの質問です。 自身でまずはやってみましょう。
miyabi_takatsuk

2019/10/01 06:53

私のコメントよく見てください。 "質問本文に記載"してください。 質問編集の<code>ボタンを押すと挿入される、 ``` この間にソースコードを入れる ``` ってやります。
guest

回答3

0

JavaScript

1document.documentElement.setAttribute('data-month', (new Date().getMonth() + 1).toString());

CSS

1[data-month="1"] body { 2 background-image: url('january.png'); 3} 4 5/* 以降同様 */

投稿2019/10/01 06:35

x_x

総合スコア13749

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

marcom

2019/10/01 06:51

回答ありがとうございます、初質問で、不備の多いなかありがとうございます。
guest

0

ベストアンサー

単純に、ファイル名を固定して、毎月、格納しているファイルを変更するとか。

例えば、"project1"フォルダ( ディレクトリ ) にhtmlや画像ファイル等があるとして、
毎月 background.jpg というファイル名で変更する。(手作業)

もしくは、

htmlかJSファイル等に
1月: 1月.jpg
2月: 2月.jpg
...
と指定するようにする。

質問者さんがコードを出していないので、ここまでしか説明できません。


[追記1]

(追記読んで)了解しました。

それではDOM操作っていうのをやってみてください。

私なら bodyタグを動的に書き換えて行いますね。

配列を用意して、これに表示する画像のファイル名を記述しておく。

投稿2019/10/01 06:24

編集2019/10/01 07:20
BeatStar

総合スコア4958

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

marcom

2019/10/01 06:51

回答ありがとうございます、初質問で、不備の多いなかありがとうございます。
marcom

2019/10/01 07:42

DOM操作という単語で調べて、何をしていくのか方向が見えてきた感じです、まだまだ解決はしてませんが...ありがとうございました!
guest

0

月が変わるごとに

  • cssを切り替える
  • 画像ファイルを切り替える

でも対応できそうですが
new Date().getMonth();
で月が得られるので、配列と組あせて処理してもよいでしょう。
(ただし1月が0、2月が1・・・・12月が11)

投稿2019/10/01 06:24

yambejp

総合スコア114572

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

marcom

2019/10/01 06:51

回答ありがとうございます、初質問で、不備の多いなかありがとうございます。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問