コンパクトデジカメ画像で、日常&花&趣味など!ボチボチ弄ってまぁ~す♪

 ジャプラノート2

 コンパクトデジカメ画像で、日常&花&趣味など!
 ボチボチ弄ってまぁ~す♪

Google
 

Yahoo!検索


pc1
       いらっしゃいませ♪ 現在ジャプラノート2をご訪問の方は 名様ですぅ~♪    

<<04 1234567891011121314151617181920212223242526272829303106>>
スポンサーサイト
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。
--/--/-- --:-- | スポンサー広告 | page top↑
4分割オンクリックのソース♪
四分割のオンマウスクリックですぅ~♪
方法は、いくつか有るのですが。。。
大きく分けると?2種類になります。

1つは前回の【ステレオグラム】で使用した。。。
画像を12枚使用するタイプですぅ~♪

2つ目は今回の、最初の画像を4分割しないで!
画像を9枚使用するタイプですぅ~☆彡

最初の物は、画像を下に隠しておくような使い方をしますが。。。
2つ目は、画像を上に載せていくような使い方をします♪
そこで!問題になるのが。。。
上に載せていくと、最初の画像が見えなくなってしまいますので!
特殊な透明画像を使用して!作ります♪
作ったものが、下の画像ですぅ~☆彡

〔オンマウスで画像が変化♪クリックで画像を別ウインド表示します♪〕
<<<<
(画像が無いので、同じ物を使用していますぅ~(笑)

 ソースですぅ~♪ 【別ウインド4分割(BGタイプ)】
<center><table width="430" background="☆最初に表示される画像アドレス"><tr><td width="423" height="310"><font style="font-size:1px;line-height:1%;"><<img onmousemove="this.src='★左上オンマウス画像アドレス'"onmouseout="this.src='□'"src="□"onclick="window.open('■クリック画像アドレス','nwin2','scrollbars=no,width=△,height=▲,');" width="210" height="155"><<img onmousemove="this.src='★右上オンマウス画像アドレス'"onmouseout="this.src='□'"src="□"onclick="window.open('■クリック画像アドレス','nwin2','scrollbars=no,width=△,height=▲,');" width="210" height="155"><<img onmousemove="this.src='★左下オンマウス画像アドレス'"onmouseout="this.src='□'"src="□"onclick="window.open('■クリック画像アドレス','nwin2','scrollbars=no,width=△,height=▲,');" width="210" height="155"><<img onmousemove="this.src='★右下オンマウス画像アドレス'"onmouseout="this.src='□'"src="□"onclick="window.open('■クリック画像アドレス','nwin2','scrollbars=no,width=△,height=▲,');" width="210" height="155"></font></td></tr></table></center>

※ まず最初に、小さい4枚の画像のサイズを決めます。
今回のサンプルは、210×155pxの画像を4枚並べたものです。

〔1〕【☆最初に表示される画像アドレス】の場所には。。。
  210×155 を縦横に並べ2倍した!420×310の横にプラス10px!
  縦にプラス7pxの画像(430×317)を作成しURLを記入します。

〔2〕【★左上・右上・左下・右下オンマウス画像アドレス】には、
  それぞれ、210×155pxの画像を4枚用意しURLを記入します。

〔3〕【■クリック画像アドレス】には、クリックした際の画像URLを
  記入しますが大きさに関しては、別ウインドで出ますので
  4枚とも異なってもかまいませんが。。。
  その画像のサイズを記入する△&▲の部分には、それぞれの画像の
  縦横に20pxをプラスした数値をご記入下さいね。

〔4〕最後に、2ヶ所の □ の部分ですが。。。
  ここが、今回のポイントの部分です。
  ここに!透明な画像のURLを記入します!
※ ご自身で、お作りになれる方は制作してご使用下さい。
  作り方が、解らない方は。。。
  下の四角い部分にカーソルを載せ右クリック⇒名前を付けて画像を
  保存で!保存し、ブログサーバーにUPしてご使用下さいね♪
  透明画像♪


赤色の数値は〔1〕で作製した画像の横サイズです。

青色の数値は〔2〕で作製した210×155pxの画像を横に2枚並べた
  数値に3pxをプラスして、記入してくださいね。


緑色の数値は〔2〕で作製した210×155pxの画像を縦に2枚並べた
  数値をそのままご記入くださいね。

この方法ですとCSS(スタイルシート)の影響やgooブログの
タグゴミ?の影響を受けにくくなりますがぁ~。。。
かなり!面倒臭いですぅ~!!!(笑
横サイズや縦サイズの計算を間違えると!
画像の横&下にゴミが出たり、画像が2枚並んだりしますので
ご注意下さいね♪

2006/10/09 18:59 | Blogカスタム | トラックバック(0) | コメント(18) | page top↑
<<ヒガンバナ♪ | ホーム | 月に1度の。。。>>
コメント
ますたー。さん♪こんばんわぁ~♪
うわぁ~☆☆☆(-_☆)またまたぁ~♪こんなおいしいぃぃいぃ~♪
タグ作ってくれちゃって。。。美味しい。。欲しい。。。
頂いてもいいですかぁ~???頂きまっすぅ♪♪ヽ(^o^)ノ 
でも。。。難しそう。。「数値は?で」??これママの画面では読めない(泣
勉強するからおじえでぇ~(^_^;)

それにこの美味しそうなケーキ。。。こんなに自分だけ食べたのがぁ~~(゚o゚;)ヨダレェ~

はぁ~ひぃ~ふぅ~ふぇ~ほぉ~~!!!タイキョ~
2006/10/09 23:12URL | 出羽ママ #-[ 編集] | page top↑
はじめまして~
あのー、これらのソースはお借りしていいのでしょうか?
私のブログで使っても構いませんか?
もっとも、詳しくないので使えないかもしれませんが。
うらやましいです、こういうことに詳しい方が‥‥
2006/10/09 23:48URL | jun_ko #-[ 編集] | page top↑
出羽ママさん♪ こんばんにゃぁ~っす♪
コメント♪めっちゃ!うれぴぃ~っす♪

おかわり自由ですよ~(笑
でも。。。
あまり食べ過ぎると!頭痛が痛く?なりますよ~(笑
って!!!
もう!ママさん♪食べてるよ!(笑

マクドナルドは、○数字はだめだったのねぇ~♪
早速!書き換えましたよ~♪大事な所ですからね☆彡

このケーキに!見覚えはありませんかぁ~?
前に作った♪白桃のレアチーズケーキとパンプキンプリンだじょ~☆彡
そろそろ涼しくなって来たので♪
オーブン♪使おうかなぁ~♪
2006/10/10 01:24URL | ますたー。 #kJ7UNJBs[ 編集] | page top↑
jun_koさん♪はじめましてぇ~♪
コメント♪ ひじょ~に!嬉しいですぅ~☆彡

ハイハイ♪
どんどん、お使いくださいね♪
ご使用のブログサーバーによって!タグの規制などが有りますので
旨く使用できるかは、解りませんがぁ~?
なるべく、色々なBlogに対応できるようなソースにしていますので。。。
大丈夫?だと思うのですがぁ~♪(笑

これからも!宜しくです♪
今日は、ありがとうございました。
2006/10/10 01:43URL | ますたー。 #kJ7UNJBs[ 編集] | page top↑
なるほど!backgoround と window open タグというのがあるのですか。
ますたー。さんが「市販ソフトは帯に短し襷に長し」と仰ったの、これ名言だと思います。

プロはプロを知る。という事なのでしょう。
タマは読み込みに時間がかかりますが、そのうちに成功させようと思います。

ありがとうございました。
2006/10/10 09:18URL | タマでございます #-[ 編集] | page top↑
v-384ますたーさんこんにちは。
何やら難しいこと、私に出来るかどうか今日いただいて行きます。
いつもの事なので何でも頂いちゃっていますが~
UPの暁がくるかどうか~
鉢巻で頑張りタイ、念願ですが。
さすが師匠です、ますますたー尊敬v-421
有難うございました。

2006/10/10 14:59URL | 玲 #-[ 編集] | page top↑
ぐわっ。
ズルイ。こんな美味しい物を美味しそうに撮るなんて・・・
我慢できなくなるでしょうが・・・・・・・。
連休の間 飲みすぎ食べすぎ・・・・どうにも止まりませんでした。

で?元気でしたか?(*^_^*)
2006/10/10 16:00URL | EMU。 #s5RVRKAk[ 編集] | page top↑
タマさん♪ こんちゃぁ~っす!
コメント♪ありがとう!めっちゃ!嬉しいですぅ~♪

やっと、完成しましたので♪
お暇な時にでも、使ってみてくださいね♪

backgoround は、TABLE タグなどで良く使用するもので
背景を指定するためのものですぅ~♪
window open は、別ウインドを開くためのものですぅ~♪

>「市販ソフトは帯に短し襷に長し」
どちらかと言うと。。。
『帯に短し襷にも!短し?』ってところですぅ~(笑
自分としては、なかなか痒い所に手が届かない?って、ことですかねぇ~(笑

プロなんて!!!
とんでもありませんよ~(笑
ほんと!趣味なんですよ~(笑
プロだったら。。。
もっと!お金になる事に、頭を使うのでしょうけどねぇ~(笑
おいらの場合は。。。
老化防止の頭の体操って!感じですぅ~☆彡
2006/10/10 17:20URL | ますたー。 #kJ7UNJBs[ 編集] | page top↑
玲さん♪ こんちゃぁ~っす!
コメントありがとう♪ ひじょ~に!嬉しいですぅ~♪

やっぱ!面倒臭かったですよねぇ~。。。
この辺が、素人って感じですぅ~(笑

>UPの暁がくるかどうか~
おいおい!
もう既に!UPしてありましたよ~♪
流石!玲さん♪早いですねぇ~(笑
やっぱ今回は。。。失笑でしたねぇ~(笑
ブログに支障が出ない事を祈るだけですぅ~☆彡
2006/10/10 17:27URL | ますたー。 #kJ7UNJBs[ 編集] | page top↑
EMU。さん♪ こんちゃぁ~っす!
コメント♪ どもどもですぅ~☆彡

エヘヘヘヘッ♪
でも。。。
このケーキは去年、作った物なんですよねぇ~♪
とぉ~~~っくに!食べちゃったしぃ~(笑

食べ物の撮影は。。。
美味しい物は、より!美味しそうに♪
不味い物は、それなりに!美味しそうに。。。を
もっとうに、撮影していますぅ~(笑

EMU。さんも、揉み過ぎ?じゃ~なっくって!
呑み過ぎには、注意してね♪(笑
2006/10/10 17:39URL | ますたー。 #kJ7UNJBs[ 編集] | page top↑
ますたー。さん♪こんばんわぁ~♪
ありがとうですぅm(_ _)m早々に書き換えてくれるなんてぇ~♪♪
流石 !!!師匠.....勉強しまっすぅヽ(^o^)ノ ガンバルジョ~

呪いの呪文を解読します。。。(笑)

はぁ~ひぃ~ふぅ~へぇ~フォ~~~ッ☆彡
2006/10/11 00:02URL | 出羽ママ #-[ 編集] | page top↑
EMUさん<

ぐわっ。
ズルイ。

これって、絶対にますたー○にやられてるね、ヨサコイの画像からは想像でけへんて。そう思いません?>ますた~。
2006/10/11 04:04URL | 管理人@しんじワールド #mQop/nM.[ 編集] | page top↑
出羽ママさん♪ おっはよぉ~っす♪
コメント♪めっちゃ!嬉しいぃ~じょ~☆彡

呪いにかかると。。。
解読が、のろいじょ~♪
象形呪いの初期症状は、頭痛ですので。。。
少しずつぅ~!解読してねぇ~☆彡(笑

はぁ~ひぃ~ふぅ~へぇ~ホゲェ~~~♪
2006/10/11 05:45URL | ますたー。 #kJ7UNJBs[ 編集] | page top↑
しんじさん♪ おっはよぉ~っす♪
コメント♪ あざぁ~っす☆彡

○菌?って!自転車メーカーじゃないよね?(笑
ホイッ!のホイッ!のホォ~イ♪(古ッ!

素敵な女性に♪。。。『我慢できなくなる』?
なぁ~んて!言われたら。。。
ヨサコイ画像を見ながら♪
想像するっきゃないですよねぇ~(爆 !!!
これ!だれにも、内緒ねッ♪(笑
2006/10/11 05:56URL | ますたー。 #kJ7UNJBs[ 編集] | page top↑
ますたーさん、おはようございます。
うわー!これはまた嬉しい画像四分割のソースのUPですね。ありがたや!ありがたや!

画像四分割、作り方はいろいろあるんですね。
透明画像?なんて初めて聞きました。

もうすでに玲さんが早速UPされていて驚きました。
皆さん理解が早いですね。後からノコノコついて行きますので、またご指導よろしくお願いいたします。
ソースは早速コピーさせていただきました。
ありがとうございました。
2006/10/11 09:32URL | 風のたより (S.K) #-[ 編集] | page top↑
風のたより(S.K)さん♪ おこんばんわぁ~♪
コメントありがとう♪ ひじょ~に!嬉しいですぅ~♪

他の方が、やっていると。。。
つい!自分なりに工夫してみたくなるのが!
悪い癖ですよねぇ~(笑
風のたよりさんも!だいぶ悩んだのに。。。
また、悩ませちゃって!ごめんなさいね♪(笑

本当は、そっと♪エントリーして、自己満足で!
終わらせようとも思ったのですが。。。(笑
あまり悩まないよう!サラッと流してくださいねぇ~(笑
自分としては、大切なのは小技ではなくて。。。
その方のお人柄&ブログの中身だと思いますのでぇ~♪
(中身の無いおいらが言うのも、変ですが。。。)
あくまでも、記事の表現方法の1つと思って♪
楽しんでいただけると♪嬉しいですぅ~☆彡(笑
2006/10/11 18:47URL | ますたー。 #kJ7UNJBs[ 編集] | page top↑
ますたーさん こんばんわ。
今年最後(?)の更新に 画像9枚使用の≪別ウインドウ4分割≫に挑戦してみました。
今回は 一度で成功です。
ますたーさんの「ソース」に出会って ブログの更新が楽しくなりました。(洋裁が お留守になってしまいましたが)

くる年が良い年でありますように!
ありがとうございました。
2006/12/30 01:04URL | shigeko #-[ 編集] | page top↑
shigekoさん♪ おっはよぉ~っす♪
コメント♪ ひじょ~に!嬉しいですぅ~♪

今年は、shigekoさんと出会えて♪
とぉ~っても!素敵な年になりましたぁ~♪
本当に、ありがとうございましたぁ~☆彡

終わり良ければ、全て良しぃ~♪
完璧な四分割ですねぇ~♪とぉ~っても、素敵ぃ~☆彡
shigekoさんに喜んでもらえて、めっちゃ!嬉しいですぅ~♪

来年も♪素敵な年で有りますように♪
ありがとうございました。
2006/12/30 10:37URL | ますたー。 #kJ7UNJBs[ 編集] | page top↑
コメントの投稿












管理者にだけ表示を許可する(内緒話にはチェックを入れてね♪)

トラックバック
トラックバックURL
http://japra.blog34.fc2.com/tb.php/370-6ad1da7f
この記事にトラックバックする(FC2ブログユーザー)
ホーム

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。