トップの画像 TOGAQ X0 Facebook0 はてブ0 Pocket0 Pinterest コピー 2004.02.17 TOGAQ トップの画像について問い合わせが。現在、11種類アップしています。Javascript で表示する画像を決めているので、無駄にアンテナに拾われることもないみたいです。興味がある人はソースをチェックして下さいまし。カンタンです。 トップの画像を複数のサイトで共有したらどーだろう、絵画廊というかなんというか。バックグラウンドの画像を共有するというアイデアに興味がある人はコメント下さい。もう少し形になってきたらエントリー化します。
コメント
説明文のページ、書き直しています。ファイル名、場所は同じです。
私もエントリーの絵使って宣伝します。よろしいですよね?
もちオーケーです>エントリの絵
エントリの絵を使ってウチでも宣伝していいすか?
えー、エントリを作りました。インパクトも必要と思い図式化。
自分のサイトでそれぞれよりすぐりの10個を共有できるという方法はどーでしょう。
プログラムなどの知識はほとんどありませんし、
画像もすぐには用意できませんが、
@Niftyの「ココログ」上でもできそうですよね、
できるようでしたら参加させてくださいませ。
ちなみに、GIFイメージは必ずしも透過である必要はないので…。
色々試してみたんだけど、グレーを2階調064と192で作っておいて、バックの絵にあわせて切り替える、ということも出来ますね。アトリビュートつけないとならないので、読み込みに時間がかかるのと、メンテが大変なのが欠点。
それと、元旦とかクリスマスとか、季節にあわせたモノも表示したいな、と思ったんだけど…。そうなると引数渡して指定するか、スクリプト側で勝手にやるか…。ムズイです。
参加者は今のところは3人ですか…。まぁ大々的に宣伝してないから、どんなものになるのかわからないというのもあるだろうし。
作ってみました。 http://siesta.co.jp/… ドメインまで指定しているなら、自分のところで画像を管理して
ドメインをランダムに呼び出して URL とできないかね。
この場合、ファイル名は固定になるけど。
透過GIF、やっぱり奇麗にはのっからないねぇ。ふちがギザギザとうか。
V.J.Catkickさん、解説わかりやすいと思います(→自分のレベルでは)
このやり方だと<div>タグにスタイルとして組み込めますね。
あとはどのようになるのか楽しみではありますが、参加者がチト少ないのが残念ですね。
http://www.vjcatkick.com/… 解説のページをカンタンにまとめてみました。
使い方、難しすぎでしょうか?
>Table 使わないとダメ?
大丈夫だと思います。
div の部分からdocument.writeで書いてやれば問題ないでしょう。
関数にファイル名だけ取得するやつを作っておきますね。
来るべき日に備えて幅とかを800pxに修正したりしました。
でもバックグラウンドの画像をランダムで変更するにはTableを使わないとダメですかね?<div id=”xxxx” style=”background:#FFFFFF url(‘images-url’) top left no-repeat;”>みたいなのではJava Scriptは使えないですよね。
作者ごとにランダムっていうのはやってないけど、JavaScriptだけで特定のディレクトリからファイルを持ってくるスクリプトは出来ました。
サンプルで作ったものが、ウチのページの「@」のアイコン押したページで使っています。
パールとかCGIとかにするのが一番いいんだけど、敷居が高くなるので、JavaScriptのみです。
構造としては、スクリプトを持っている人が絵の管理をし、スクリプトファイルに登録していく、という方式になります。
使う側はスクリプトファイルを外部JSファイルとして読み込み、関数を呼びます。
関数はファイルへのURLを返しますので、使い方色々となりますね。汎用性を持たせるために、サイズの指定とかは各自のページでご自由に。
一応、たたき台として、さらに煮詰めていきましょう。
作者分けはフォルダ番号振ってそれで分ければ取れると思うよ。
例えばN氏のフォルダは「000」フォルダ、alfさんは「001」とかね。
実際には 000/headpic_001.jpg とか指定すればいいわけでして。
ランダムで取ってくるときに、フォルダ名に偏りを持たせれば、自分のところから重点的にもってくるでしょう。
わたしももう少しまとめてみますね。
おねがいしまーす。なんか楽しみっす!
もう少しまとまったらエントリーにしますね。
今の画像は 800 * 101 なんです。
バックグラウンドに画像を貼って上に透過GIFを重ねると、
Webサイトをプリントした時に Background が印刷され
ないので、わざわざ画像を置いているんですよね。
でも Background を使うしかないかな。
置き場所はどっかに集中させるとして、画像のフォーマットを
決めましょう。
共有画像フォーマット(案)
・800 * 100 (僕のところの修正しておきますよ)。
・50 * 200 以内で四隅に画像のクレジットを入れるのはオーケー。
・画像は JPEG のみ(スクリプトで指定するため)。
・ファイル名は headpic_xxx.jpg 。xxx は数字。
管理をどーするか。どこに置くか、ジャンルやシーズン、作者ごとに
ファイルを分けるか。分けた場合、どうやって呼び出すか。
ファイル名を作者ごとに分けると「自分のを重点的に呼び出す」とか
可能ですが、ソースの方でシーケンスナンバーだけでなく、ファイル
名も意識しないとダメですよね。
アイデアよろしくー。
おーっ、共有賛成。
参加者がひとり一つずつ画像を準備するってのもおもしろいかもね。
もち縦横と形式を揃えて。
おー、かっこいー
そうそうこの間重要なことを伝えわすれたんですよー
僕のホームページのタイトルのフラッシュって
N@さんの「気になるモノインデックス」にインスピレーションを受けたんですよー
その事を伝えられなかったことが残念で残念で、、、汗
んーと、ウチのトップページはバックの絵と、サイトロゴは別々になっています。つまり、後から書いてます。ソースみてちょ。
あー、Javascript 自体はインターネットで検索して見つけたやつに
変更を加えたものです。なのでご自由にどうぞー。猫氏のスクリプト
に変えようかな。
共有する件は、バックの画像だけ共有して題名だけをレイヤーで
重ねられればいいねー。数人じゃ面白くないけど。
画像にロゴを入れておいて、題字はスタイルシートかなんかでね。
こうするといちいち数を数えなくても、ファイルの数を勝手に参照してくれます。
注意:配列最後のアイテムに「,」を打つとエラーになりますので注意。
<script language=”JavaScript”><!—
var imgArry = new Array(
“headimg_01.jpg”,
“headimg_02.jpg”,
“headimg_03.jpg”,
“headimg_04.jpg”,
“headimg_05.jpg”,
“headimg_06.jpg”,
“headimg_07.jpg”,
“headimg_08.jpg”,
“headimg_09.jpg”,
“headimg_10.jpg”
);
document.write(‘<img src=’);
document.write(imgArry[Math.floor(Math.random() * imgArry.length)]);
document.write(‘>’);
// –>
</script>
※「<>」はお決まりの全角文字。
使わせてもらおうかなぁ〜。
使用許諾条件って何かあります?
例えば、このタイトルはN@さんのスクリプトを使用してますみたいなものを入れるとか…。
思ったんですけど、どっかに置いておいて、共用したら面白いかも…。