とろ～りとゆら～りと画像をスライドショーにして見た

風の吹くまま気の向くまま。。。

[PR]

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

2024/04/25 (Thu)

以前入れた、Ｌｉｔｅｂｏｘとかちあうかな～と思いつつ、
入れてみたらうまくいったんで設置。

（Netscapeでは、フェードしないとのこと）

フッターで頭が煮詰まり、逃避にもなったし～

もう、このままシンプルでいいかも。。。

画像をスライドショーにするのに影付けたかったんだけど、
途中でめんどくさくなって、フィルターにしてしまいました。

なので、Ｆｉｌｅｆｏｘでは影が出てないです。
フィルターは、ＩＥ（Internet　explorer5.0以上）独自なので、ほかのブラウザでは使えないんですね～。

（使えるようになるのが一番なんだけど。。せめてFilefox。。）

ソフト工房文人-Webシステム開発

上記サイトの

Java-Script

使用。

<head>～</head>内に

<SCRIPT LANGUAGE="JavaScript">

</SCRIPT>

にします。
（アップロードした画像をクリックすると別ウィンドウが出てくるんで、でてきたウィンドウ内の画像を右クリックすると画像のＵＲＬが出てくるからそれをコピペ。）

次に、<body>内に

<body onload="initLightbox(), start_fade()">

と、します。

Lightboxを入れて無い場合は、<body>内に

<body onload="start_fade()">

こうですね。

できたら上書き保存します。

表示させたい所に、

<img src="アップロードした画像のURL①" name='SlideShow'>

とするだけ。

hard内に入れた画像の分だけ、スライドショーができます。

画像サイズはあらかじめ統一しとくと言いと思います。

fade_speed　が、入れ替えに要する時間です。
fade_duration　が、フェードに要する時間です。

ＩＥだけだけど、影をつけてみる

【HTMLタグの簡単検索】TAG index - ホームページ作成情報

スタイルシート［CSS］/フィルタ - TAG index

ここで参考にさせてもらいました。

うちの場合、ＣＳＳで指定して、<div>～</div>で表示させてます。

/*ＴＯＰ画像*/
.好きなアルファベットの要素名{
float: right;
padding: 20px 60px 0px 0px;
width: 200px;
height: 150px;
padding-bottom: 10px;
filter: dropshadow(color=#bb5520);
}

表示させるときのタグは、