HPの背景で朝、昼、晩とその雰囲気の背景画像に自動変更したいのですが
そのようなスクリプトをご存知のかた、またはサイトを教えて欲しいのです
が・・・よろしくお願いします。

このQ&Aに関連する最新のQ&A

A 回答 (3件)

 下記の「インサイドウェブ」のJavaScriptのコーナーに、ご希望のスクリプトのヒントとなるものが置いてあります。



 他にもたくさんのサンプルが置いてあるので、一度ご覧になってみてはいかがですか?

注)ここに置いてある全てのサンプルは、ご自分のHPにインサイドウェブへのリンクを貼るだけで、無料で利用可能だということです。

参考URL:http://www.inside.ne.jp/
    • good
    • 0

とりあえず手っ取り早い方法。


<HTML>
<HEAD>
<title></title>
</HEAD>
<BODY>
<SCRIPT LANGUAGE="JavaScript">
<!--
date = new Date()
hour = date.getHours()
image_path = 'cgi-bin/image';
morning_image = "ohayo.gif"
daytime_image = "konchiwa.gif"
night_image = "konbanwa.gif"

if (hour >= 6 && hour < 11) {
bg_image = morning_image
} else if (hour >= 11 && hour < 17) {
bg_image = daytime_image
} else {
bg_image = night_image
}
document.write("<BODY background=" + image_path + '/' + bg_image + ">");
//-->
</SCRIPT>
あああ
</BODY></HTML>

document.bgColor = ...で代入しようとするとハマります。
(画像は背景色とは事情が違う)まあここは手っ取り早くBODYタグを
直接書き出してしまいましょう。

image_pathのところや、morning_imageのところを適切に変えてください。
(画像ファイルがこのHTMLファイルと同じディレクトリにあるなら
document.write("<BODY background=" + bg_image + ">");
でいいでしょう)

なお、hour >= 6 などのところが時間に応じて処理を分岐させている所です。
お好きな時間帯になるよう調整してください。
    • good
    • 0
この回答へのお礼

Head_Syndicate様
さっそくのご解答ありがとうございます。
試してみます。
貴殿のますますのご活躍をお祈りいたします。
重ねてありがとうございます。

お礼日時:2001/05/16 09:03

CLUBとむやん君というサイトさんでサンプルプログラムを配布していらっしゃいますよ。



トップ⇒Javascript講座⇒背景

アクセスする時間ごとに背景を変えられるサンプルもあります。
ページ自体に説明書きのようなものはないのですが、ダウンロードしたサンプルの中に入っているHTMLを見れば全部詳しく解説しています。それでもわからない場合は質問掲示板があるのでそこで質問してみると良いと思います。
参考URLにアドレス入れておきますね。

頑張ってください。

参考URL:http://www2s.biglobe.ne.jp/~club_tom/
    • good
    • 0
この回答へのお礼

sonata様
早目のご解答ありがとうございます。
挑戦してみます。
貴殿のますますのご活躍をお祈りいたします。
重ねてありがとうございます。

お礼日時:2001/05/16 09:02

このQ&Aに関連する人気のQ&A

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aを見た人はこんなQ&Aも見ています

このQ&Aを見た人が検索しているワード

このQ&Aと関連する良く見られている質問

Qはがきの大きさの背景イラストを無料でダウンロードしたい!!

こんばんわ

最近、はがきにて懸賞に応募しているのですが、
白地のはがきに黒のボールペンで書いても味気ないので
PCで背景を印刷してから応募内容を書いて見ようと思いますが。。。

うまく無料でダウンロードできて「はがき大の背景イラスト」なのが
見つかりません。
どなたか詳しい方いらっしゃいましたらよろしくお願いします

Aベストアンサー

イラストではないですが、こちらのサイトの左下にある「背景」は使えると思いますよ。
「ファミリー」「フォーマル」「和風」と種類があります。
年賀状用のサイトなのですが「背景」には文字が入っていないので、いろいろな使い方ができると思います。
http://cp.c-ij.com/japan/otasuke/nenga/

QHTML罫線の行にmouseoverで行全体の背景色を変えるスクリプト

罫線の行<tr>~</tr>に、マウスが乗ると
ハイライトされるような仕組みのサンプルプログラム使い、
具体的には、こうして、highlight.htcを呼び出しています。
<tr style='behavior:url(highlight.htc);'>

◆質問◆
ところが、↓のようにすると、
(1) Aにカーソルを乗せる⇒A、Bにハイライト
(2) Bにカーソルを乗せる⇒Bだけにハイライト
(3) Cにカーソルを乗せる⇒Cだけにハイライト
となりますが、(1)のケースでもBだけにハイライトを当てる
(=セルAにだけは常にハイライトをあてない)
ようにするのはどうしたらよいでしょうか。

よろしくお願い致します。

<table>
<tr style='behavior:url(highlight.htc);'>
<td rowspan="2"></td>
<td></td>
</tr>
<tr style='behavior:url(highlight.htc);'>
<td></td>
</tr>
</table>

┏━┳━┓
┃ ┃B┃
┃A┣━┫
┃ ┃C┃
┗━┻━┛

-----------------------------highlight.htc

<script type="text/javascript">
<!--
attachEvent("onmouseover", detailTr_onmouseover);
attachEvent("onmouseout", detailTr_onmouseout);
function detailTr_onmouseover() {
this.style.backgroundColor='#000000';
}
function detailTr_onmouseout() {
this.style.backgroundColor='transparent';
}
-->
</script>

------------------------------

罫線の行<tr>~</tr>に、マウスが乗ると
ハイライトされるような仕組みのサンプルプログラム使い、
具体的には、こうして、highlight.htcを呼び出しています。
<tr style='behavior:url(highlight.htc);'>

◆質問◆
ところが、↓のようにすると、
(1) Aにカーソルを乗せる⇒A、Bにハイライト
(2) Bにカーソルを乗せる⇒Bだけにハイライト
(3) Cにカーソルを乗せる⇒Cだけにハイライト
となりますが、(1)のケースでもBだけにハイライトを当てる
(=セルAにだけは常にハイライトをあてない)
よう...続きを読む

Aベストアンサー

<body>
<table>
<tr style='behavior:url(highlight.htc);'>
<td rowspan="2" style="background-color:#FFFFFF">A</td>
<td>B</td>
</tr>
<tr style='behavior:url(highlight.htc);'>
<td>C</td>
</tr>
</table>
</body>
</html>

Qフリーのイラストを集めたいのですが、背景が邪魔です

無料の素材サイトから、人物や物(電話機、自動車など)のイラストを集めたいのですが、背景が邪魔です。

素材集では、ほとんどの素材の背景は白になっていると思いますが、背景がクリア(無色)の素材はどこかにありますか?

それとも、やはり、一つずつ切り抜いていかなければならないのでしょうか?

Aベストアンサー

こんにちは。

時々フリーの素材サイトでも、透過ファイルで提供しているサイトがありますよ。
下記はいずれも、商用利用・加工可能です。

http://www.emstudio.jp/
http://sozaizchi.com/index.html
http://sozai.7gates.net/info/kiyaku.html


ちなみに、Photoshopですと、次の方法で背景を削除できます。

1.背景色が1色の場合
 自動選択ツールで背景をどこか選択 → 削除

2.背景が複雑な場合
 フィルタメニュー→抽出、で画像全体を選択


他にもいろいろな方法で画像のみ、残すことができます。

下記のようなサイトもありますので、ご参考まで。
http://www.dougamanual.net/photoshop.html

QDOMを使った、スクリプトを自分で組み立てたときまたは、ソース掲載サイ

DOMを使った、スクリプトを自分で組み立てたときまたは、ソース掲載サイトのスクリプトを、変数名やfunction名を変えて実行すると、document.getElementById("obj") is null という風になり、全くできません。
(objにはid名が入ります。)
なぜでしょうか。

Aベストアンサー

おそらく、ドキュメントを読みこむ前に実行しているのでは?

<script type="text/javascript">
// エラー
var obj = document.getElementById("hoge");
</script>
<body>
<div id="hoge"></div>
</body>

よってwindow.onloadを利用する事になります。

window.onload = function() {
 var obj = document.getElement...
}

が、onloadはひとつしか関数を割り当てられません。
よって最近では以下のようonloadイベントに関連付ける関数を指定するのが妥当でしょう。

function func() {
 var obj = document.getElement...
}

if (window.addEventListener) {
 // Firefox, Safari, その他もろもろ
 window.addEventListener("load", func, false);
} else if (window.attachEvent) {
 // IEのみ
 window.attachEvent("onload", func);
} else {
 // 念のため
 window.onload = func;
}

上記のようにブラウザ毎に処理を変える必要がありますので、個人的にはDOM操作やAjaxをするのであれば、prototype.jsやjQueryなどのクロスブラウザなライブラリを利用するのを強く推奨します。

おそらく、ドキュメントを読みこむ前に実行しているのでは?

<script type="text/javascript">
// エラー
var obj = document.getElementById("hoge");
</script>
<body>
<div id="hoge"></div>
</body>

よってwindow.onloadを利用する事になります。

window.onload = function() {
 var obj = document.getElement...
}

が、onloadはひとつしか関数を割り当てられません。
よって最近では以下のようonloadイベントに関連付ける関数を指定するのが妥当でしょう。

function func() {
 v...続きを読む

Qイラストの背景が黒くなる

インターネットでイラストをダウンロードしていました。マイピクチャーの中に気に入ったイラストを入れておくと便利なので。ところが、「開く」で見るとイラストの背景が白なのに、「保存」すると背景が黒になってしまいます。さっきまで他のイラストは平気だったのに急にそうなり、それ以降はみんな同じ現象です。何か設定が変わっちゃたのでしょうか? どうすれば白い背景にもどりますか? OSはXPです。イラストをダウンロードしていたサイトはプリントアウトファクトリーというサイトです。

Aベストアンサー

プリントアウトファクトリーというサイトは、http://www.printout.jp/
ですよね?

で、どのイラストからそのような現象が起きてるのでしょうか?
また、それまで正常だったイラストも、背景が黒になってしまいますか?

考えられる対処方は、ブラウザの一時ファイル(キャッシュ)のクリアを試してください…改善されるかも。

または、元々そのイラストには、背景色は無く透明だった…と云う可能性もありませんか?

Qスクリプト内から他の外部スクリプトを読み込みたい

Java Script初級者です。
外部スクリプト内から他の外部スクリプトを読み込むことは可能ですか?

実現したい内容はスクリプト内の関数から▼下のような感じで外部ファイルを読み込むことです。
function check(fm) {
<script language="JavaScript" src="AAA.js"></script>
}

何か良い方法がありましたらぜひ教えてください。

Aベストアンサー

え~と、細切れに書いたことをまとめますと
以下のようになります。
これで、動くはず・・・・・

<html>

<head>

<script>

function dynamicLoad(jsFileName){
var now =new Date();
var getData =jsFileName+'?nc='+now.getTime();
if(document.all){
if(navigator.userAgent.indexOf("Win")!=-1){
eval(document.all('dynld')).src = getData;
}else if(navigator.userAgent.indexOf("Mac")!=-1){
document.body.insertAdjacentHTML('BeforeEnd','<scr'+'ipt src="'+getData+'"><scr'+'ipt/>');
}
}else if(document.getElementById){
var cnode=document.getElementById('dynld');
var nnode=document.createElement('script');
nnode.src=getData;
nnode.id ='dynld';
cnode.parentNode.replaceChild(nnode,cnode);
}else{
if(document.images){
var datasrc=new Image();
datasrc.src=getData;
location.href=datasrc.src;
}
}
}

function check() {
if(document.images["soldout"]){
alert("完売しました!");
return false;
}else if(!document.forms[0].size.selectedIndex) {
alert("サイズを選択してください!");
return false;
}else {
//
//Google Code for Purchase Conversion Page
//
 var google_conversion_id=1071970427;
 var google_conversion_language="ja";
 var google_conversion_format="1";
 var google_conversion_color="FFFFFF";
 if(1){var google_conversion_value=1;}
 var google_conversion_label="Purchase";
 dynamicLoad('http://bosan.net/test2/test2.js');
//
//Overture Services Inc. 07/15/2003
//
 var cc_tagVersion = "1.0";
 var cc_accountID = "123456789";
 var cc_marketID = "4";
 var cc_protocol="http";
 var cc_subdomain = "convctr";
 if(location.protocol == "https:"){
 cc_protocol="https";
 cc_subdomain="convctrs";
 }
 var cc_queryStr = "?" + "ver=" + cc_tagVersion + "&aID=" + cc_accountID + "&mkt=" + cc_marketID +"&ref=" + escape(document.referrer);
 var cc_imageUrl = cc_protocol + "://" + cc_subdomain + ".overture.com/images/cc/cc.gif" + cc_queryStr;
 var cc_imageObject = new Image();
 cc_imageObject.src = cc_imageUrl;
//
//外部との通信完了後に送信するために送信遅延時間を設定
//
 setTimeout("xx()",2000);//この時間を調整2000は2秒の意味
}
}

function xx(){
document.forms[0].submit();
}

document.write('<scr'+'ipt id="dynld"></scr'+'ipt>');

</script>

<head>

<boy>

<form action="about:blank" method="POST">
<select name="size">
<option>▼選択</option>
<option>10cm</option>
<option>20cm</option>
</select>
<input type="button" value="買い物かごに入れる" onclick="check()" />
</form>

</body>

</html>





.

え~と、細切れに書いたことをまとめますと
以下のようになります。
これで、動くはず・・・・・

<html>

<head>

<script>

function dynamicLoad(jsFileName){
var now =new Date();
var getData =jsFileName+'?nc='+now.getTime();
if(document.all){
if(navigator.userAgent.indexOf("Win")!=-1){
eval(document.all('dynld')).src = getData;
}else if(navigator.userAgent.indexOf("Mac")!=-1){
document.body.insertAdjacentHTML('BeforeEnd','<scr'+'ipt src="'+getData+'"><scr'+'ipt/...続きを読む

Qイラストの背景を透明にしたい

イラストの背景を透明にしたい

初歩的な質問かもしれませんが、よろしくお願いします。

フォトショップのイラスト(背景が白)をインデザインに貼り込んだ際、
背景が白いままでなく透明になるようにするには、
どうしたらよいでしょうか?

例えば添付画像で示した★の部分がイラストとして、
インデザイン上で背景に色をしいて、★をのせるようなことをしたいのですが。

よろしくお願いします。

Aベストアンサー

レイヤーをダブルクリックしてレイヤー0にする
背景が白とか単色だったら色域選択して、編集→消去してPSD形式で保存

>イラストの微妙なエッジがなくなるのは覚悟することになるでしょうか?
エッジが白で無い限り、エッジは無くなりません

エッジが白の部分は選択範囲を足せばいいんだし

QJavaScript window.openで開く際、そのwindowの背景色を指定したい

親ウィンドウにある画像のサムネイルをクリックすると、子windowにその画像の大きいものが表示されるHTMLを作っています。

その際に、子windowの背景色を黒くしたいのですが、うまくいきません。以下にソースを記載します。

【HTML】
<a href="javascript:void(0);" onClick="winopen('1.jpg')"><img src="1s.jpg" /></a>

【JavaScript】
function winopen(filename)
{var w=window.open(filename,'','width=900,Height=700');
w.focus();
w.document.write("<body bgcolor=black>");
}

このようになっているのですが、これだとw.document.write("<body bgcolor=black>")のところで、窓全体が黒くなってしまい、jpgがなくなってしまいます。
jpgの背景を黒くしたいのですが、どのようにしたらよいでしょうか?

親ウィンドウにある画像のサムネイルをクリックすると、子windowにその画像の大きいものが表示されるHTMLを作っています。

その際に、子windowの背景色を黒くしたいのですが、うまくいきません。以下にソースを記載します。

【HTML】
<a href="javascript:void(0);" onClick="winopen('1.jpg')"><img src="1s.jpg" /></a>

【JavaScript】
function winopen(filename)
{var w=window.open(filename,'','width=900,Height=700');
w.focus();
w.document.write("<body bgcolor=black>");
}

このよ...続きを読む

Aベストアンサー

>w.document.write("<body bgcolor=black>");
これだと、ブラウザの画面が新しいBODYオブジェクト(背景=黒)に
なってしまい、今までの画像もテキストも消えます。

w.document.body.style.background = "BLACK";
このように、既存のBODYオブジェクトのプロパティを変更する方法に
変更してみてください。

Qイラストの背景を純白の白にするにはどうしたらいいですか?

イラストの背景を純白の白にするにはどうしたらいいですか?

今、知人が書いたイラストを自分のパソコン(Windows Vista)を使ってスキャンしています。スキャンするソフトウェアはEPSON Scanを使っています。複合機本体の型番は「PM-A900」を使用しています。

そこで質問なんですが、イラストをスキャンすると何故か背景が薄ピンクがかった色になります(白い背景の時もあります)
イラスト自体の背景の色は白なんですがスキャンするとこうなります。
特にイラストをピンク色で染めて書くと背景まで薄ピンク色になります。
これは何故でしょうか?

そして背景を純白色にする方法(ソフトウェアでも構いません)は何かありませんか?
宜しくお願い致します。

Aベストアンサー

どの方法についてでしょうか?

・スマート修正の場合、白くしたいポイントはいくつでも増やすことが可能です。(どちらかというとワンタッチ)
・背景消しゴムの場合、こするようにドラッグしつつ動かすことによってエッジにある微妙なカス(?)も一緒に消えてくれます。
・メークオーバーツールの場合、クリックすればするほどその範囲が広がっていきます

先ほどの方法とは違う方法もあげてみます。
◆カーブを使う方法
・方法1
 1.[調整(A)]→[明るさとコントラスト]→[カーブ]を選択
 2.ウィンドウ右下の白いボタンをクリック後、その画像で一番明るく指定したい部分をクリック
 3.ウィンドウ右下の黒いボタンをクリック後、その画像で一番暗く指定したい部分をクリック
・方法2
 1.RGBとなっている部分を「赤」にし、少し右下の方にカーブを動かしてあげると赤の出力が減る

◆カラーチェンジャー
 1.ラーニングセンターより「画像をレタッチ・復元する」より「カラーチェンジャー」を選ぶ
 2.色を白を選択し、白くしたいところに流し込む

画像によってベストポイントは違うので、良い感じのポイントをみつけるまで
スポイト→リセットをしてみてください。
実際、どれぐらい画像が赤くなっているかがわからないのでこんな形の説明になってしましたが、
また分からなければ補足願います。

どの方法についてでしょうか?

・スマート修正の場合、白くしたいポイントはいくつでも増やすことが可能です。(どちらかというとワンタッチ)
・背景消しゴムの場合、こするようにドラッグしつつ動かすことによってエッジにある微妙なカス(?)も一緒に消えてくれます。
・メークオーバーツールの場合、クリックすればするほどその範囲が広がっていきます

先ほどの方法とは違う方法もあげてみます。
◆カーブを使う方法
・方法1
 1.[調整(A)]→[明るさとコントラスト]→[カーブ]を選択
 2.ウィンドウ右...続きを読む

Q一定時に画像を変え、その画像にリンクを貼るというスクリプトを改造したいのですが

こんにちわ。javascriptはほとんどわかりません。既成のものをHTMLにうめこんだり、スクリプトのHTMLタグ部分を変えたりできる程度です。

今回やりたいのは、数分後に画像を変え、その画像にリンクを貼るというものですが、サンプルであったjavascriptは別ウインドウにリンクを出すというものです。これを別ウインドウではなく、そのままのページにリンク先を表示させるには、どう変えたら良いでしょうか?

http://bunjin.com/java/chang_banner2.html

こちらのjavascriptです。

先述したように、初心者です。理論で教えていただいてもわからないので、できれば具体的に教えていただけると大変助かります。あつかましくて申し訳ありませんが、どなたかお助け下さい。よろしくお願いします。

Aベストアンサー

質問者様が見つけてこられたサンプルのJavascriptを、少しだけ書き換えると出来るかもです。

こんな感じでしょうか。

---------------
<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--
var item = 0;
function change_IMG() {
item += 1;
if (item > 3) item = 0;
if (document.img.complete) {
if (item == 0) {
document.img.src = "yahoo.jpg";
}
if (item == 1) {
document.img.src = "msn.jpg";
}
if (item == 2) {
document.img.src = "google.jpg";
}
if (item == 3) {
document.img.src = "infoseek.jpg";
}
}
changeLINK();
setTimeout("change_IMG()",5000);
}
function changeLINK() {
if (item == 0) {
document.all['myLINK'].href = "http://ヤフー";
}
if (item == 1) {
document.all['myLINK'].href = "http://エムエスエヌ";
}
if (item == 2) {
document.all['myLINK'].href = "http://グーグル";
}
if (item == 3) {
document.all['myLINK'].href = "http://インフォシーク";
}
}
//-->
</SCRIPT>

</HEAD>
<BODY onLoad="change_IMG();">
<a id="myLINK" href="http://ヤフー">
<img src="yahoo.jpg" NAME="img" border="0">
</A>
</BODY>
</HTML>
---------------


setTimeout("change_IMG()",5000);
↑この部分は、5秒後に change_IMG() を実行するということです。
1秒 = 1000 なので、もし、1分経過するたびに画像とリンク先を変更したいのであれば、
5000 を 60000 に書き換えます。

質問者様が見つけてこられたサンプルのJavascriptを、少しだけ書き換えると出来るかもです。

こんな感じでしょうか。

---------------
<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--
var item = 0;
function change_IMG() {
item += 1;
if (item > 3) item = 0;
if (document.img.complete) {
if (item == 0) {
document.img.src = "yahoo.jpg";
}
if (item == 1) {
document.img.src = "msn.jpg";
}
if (item == 2) {
document.img.sr...続きを読む


人気Q&Aランキング