<   2006年 02月 ( 18 )   > この月の画像一覧
2006年 02月 28日
33 画像をpopupをさせて見ましょう① (CSS)
久々のカスタマイズです...m(_"_)m 画像をpopupさせて見ましょう①



現在このカスタマイズに不具合が出ているようです;;

調査して至急修正いたしますのでもうしばらくお待ちになってください;;;

本当にごめんなさいm(_"_)m


1.CSSの一番最後に下の文を追加します。
img {
border: none;
}
.pic {
position: relative;
top: 0;
left: 0;
float: left;
}
.pic a .large {
position: absolute;
width: 1px;
height: 1px;
top: 0;
left: 0;
}
.pic a.popup,
.pic a.popup:visited {
top: 0;
left: 0;
ALIGN:left;
}
.pic a.popup:hover {
}
.pic a.popup:hover .large {
width: 240px;
height: 320px;
top: 0;
left: 300px;
}

ここで、赤字のは、popupされた画像の位置を調整しています。
左から300pxずらすということです。
(もっと右に寄せたいときは数字を大きく、左に寄せたい場合は数字を小さくしてみてください。)
小さい画像の上に乗せちゃうときは0を指定しちゃいます^^


2.画像を一度アップロードします。
  保存をせずに、一度プレビューを開きます。
  画像の上で右クリックしてプロパティをクリックします。
  中ほどに アドレス(URL)と言う欄があります。
  この右に書いてあるのが、アップロードされた画像のurlです。
  アドレスをドラッグして、右クリックしてコピーしておきます。

記事中の
   〔#IMAGE|e0075308_21374553.jpg|200602/28/08/|mid|400|589#〕
はけしちゃってください。
*下の削除ボタンは押さないで下さいね^^;;


<div class="pic"><a href="#" title="" class="popup"><img src="http://pds.exblog.jp/pds/1/200512/15/08/e01234_56789.jpg" width="100" height="133" alt="サムネール画像" title="サムネール" /><img src="http://pds.exblog.jp/pds/1/200512/15/08/e01234_56789.jpg" width="240" height="320" alt="拡大画像" title="拡大画像" class="large" /></a></div>


赤文字の url のところ(2箇所)に、先ほどコピーした画像の url を コピーしてください。

これでサムネイルの上にマウスをあわせると右端に大きな画像が表示されます。


サムネール画像拡大画像
こんな感じです。ただし、記事の一番下でこれを行うと、画像が枠より下に出てしまいます。プレビューを見て改行するなどして見てくださいね。
これも10行くらい改行してます^^;;

*サムネイル画像の上でクリックすると、拡大画像が固定されます。画像以外のところでクリックすればまた同じようにpopupになります。

今回の説明...わかりにくいかも;;わからなかったら遠慮なく聞いて下さいね。

これを使うと他にも遊べそう^^;;
[PR]
by chocobopapa | 2006-02-28 21:56 | スキン編集
2006年 02月 28日
あれ???

文字の選択が出来なくなっちゃってますね><、、、

これではコピペで出来る...とうたっているのに...不便です!!

今調査中です;;至急対応いたしますm(_"_)m

少々お待ちになってくださいね...

修正終了です...

CSSでIEのバグにあたってしまったようです。
POSITION: absoluteを左右のカラムに設定してしまうと陥るバグのようです...
IEのバグでした
[PR]
by chocobopapa | 2006-02-28 20:37 | other
2006年 02月 27日
TEST

サムネール画像拡大画像サムネール画像拡大画像

これで文章を入れるとどんな風になってしまうのだろう^^;と言うことでいろいろなことテストちぅなのです...フレームが崩れたりはしないと思うんだけど...


なるほど...こんなこともできるんだぁ^^;
と言うわけで、テストちぅ^^

マウスを画像に合わせると...大きくなります^^;;

今度はちょっと右に大きな絵を出すようにしてます

コメントをサムネイル画像の横に入れたいときは???あれ??うまくいかないです;;
[PR]
by chocobopapa | 2006-02-27 12:20 | other
2006年 02月 27日
今御覧のスキンを...

わたしのHPにてスキン頒布中^^;;

落とされた方は...出来たらコメントを下さいませ^^;;
[PR]
by chocobopapa | 2006-02-27 07:47 | スキン編集
2006年 02月 25日
一応...完成(?)かなぁ...
このスキンは...自分なりに...完成って事で^^;

さて、もちょっとプログラムの中を整理して...

HP書いて...UPして...

ふぅ...HPできるかなぁ^^;;

その前に...Tea Timeです^^

あれれ...幅がおかしいToT...

コメント入力欄をちょっと修正...
[PR]
by chocobopapa | 2006-02-25 10:41 | スキン編集
2006年 02月 23日
最近...
ここ数週間...スキン作成にかまけて記事をぜんぜん載せていません;;

毎日毎日プログラムを見て...プレビューして...あれ?って感じです。

見た目は変わってなくても、ちゃんとプログラムのほうは変えているのですが...


初めての一からのスキン作成...面白いけど...つかれたぁ;;;

さて、もうひとがんばりで終わりそうな気配^^;


お天気もいいのでお散歩したほうがいいかな^^
[PR]
by chocobopapa | 2006-02-23 12:37 | スキン編集
2006年 02月 21日
作成中のスキン公開です

今作成中のスキンのテスト公開ちぅ

ちょっとの間だけ公開してみますので、ご意見をお願いいたします。

まだ、EXCITE ブログ用に直し切れていないので、見難いところがあると想いますが...

  
通常のエキサイトブログさんのと違うところはHTMLにテーブルタグを使っていません
     (だからなに!   ...orz) ただのこだわりです^^;
  最近のwebのホームページではテーブルを使うことがすくなって来ていますので、
その流れに乗ってみようかなって思っただけです^^;;
 後は、枠組みも画像を使っていませんので、表示速度は速い(ハズ)です

率直なご意見をお願いいたします...

このスキンは皆様のご意見を取り入れて、EXCITE用にアレンジした後に HPのほうで頒布させていただきます^^;;(いらね~よ...なんて言わないで下さいね)
[PR]
by chocobopapa | 2006-02-21 22:22 | スキン編集
2006年 02月 20日
宣伝しちゃお^^
Chocobo Style HPなぁんての作っちゃいました^^;;
コンテンツ...まだない^^;;あはは^^;;(え?笑い事じゃないって...ハイ)

近々、スキン頒布をしようかと...
[PR]
by chocobopapa | 2006-02-20 12:38 | other
2006年 02月 17日
nsudouさまへ^^ 競馬用(??) CSS
競馬...知らないのです;;が、へこたれません!調べてみました。
知らないなりに...こんな感じではいかがでしょうか^^;何の事だか良くわからないのです...言葉が暗号みたい^^;;サラ系?ダート???ちんぷんかんぷんです;;;

nsudouさま予想
2006年1回東京8日( 2月 19日) 11R
第23回 フェブラリーステークス(GI)
サラ系4歳以上 1600m ダート・左



 ① リミットレスビッド
 ② タイキエニグマ
 ③ ユートピア
 ④ ニホンピロサート
 ⑤ スターキングマン
 ⑥ サカラート
 ⑦ アジュディミツオー
 ⑧ ヴァーミリアン
⑨ シーキングザダイヤ
⑩ メイショウボーラー
 ⑪ ブルーコンコルド
 ⑫ トウショウギア
⑬ タイムパラドックス
⑭ カネヒキリ
 ⑮ タガノゲルニカ
 ⑯ サンライズバッカス


今年第1弾のG-1

フェブラリーステークスです。
ダートのG-1。
恐ろしく強い4歳馬に武が跨ってるんじゃしゃーないかな?

本命 14番 カネヒキリ
対抗  9番 シーキングザダイヤ気になるのが,10番 メイショウボーラー
 と 13番 タイムパラドクス なので

枠連 5-7 1点勝負でいきますか。


と...こんな感じです^^;;

CSSのカスタマイズです^^一番最後に下の文をコピペしてしまいましょう
.a1 {color : #000000; background-color: #ffffff; }
.a2 {color : #000000; background-color: #cccccc; }
.a3 {color : #000000; background-color: #ff8388; }
.a4 {color : #000000; background-color: #aaacff; }
.a5 {color : #000000; background-color: #fccd69; }
.a6 {color : #000000; background-color: #85ce88; }
.a7 {color : #000000; background-color: #f55981; }
.a8 {color : #000000; background-color: #ffcdff; }

もう一つ、今回の競馬用に縦書きをもう一つ設定しちゃいます^^
.keiba {
Height:220px;
writing-mode:tb-rl;
direction: ltr;
font-family:monospace,VERDANA,ARIAL,SANS-SERIF;
font-size : 12pt;
margin-top : 20px;
}


これで設定は終了~

さて記事の投稿の仕方ですが...ちょっと面倒なので...下の文を記事投稿欄にコピペしてみてください^^;;;
ここで注意です^^;

*<div class=keiba>のあとに改行して横幅の調整をしちゃってます。
*頭に○とかを入れるのに、<span class=a1>の前に全角のスペースが入ってます。
  半角のスペース2つではダメです。全角スペースです^^

nsudouさま予想
<b>2006年1回東京8日( 2月 19日) 11R
第23回 フェブラリーステークス(GI)</b>
<div class=keiba>

 <span class=a1>① リミットレスビッド</span>
 <span class=a1>② タイキエニグマ</span>
 <span class=a2>③ ユートピア</span>
 <span class=a2>④ ニホンピロサート</span>
 <span class=a3>⑤ スターキングマン</span>
 <span class=a3>⑥ サカラート</span>
 <span class=a4>⑦ アジュディミツオー</span>
 <span class=a4>⑧ ヴァーミリアン</span>
○<span class=a5>⑨ シーキングザダイヤ</span>
△<span class=a5>⑩ メイショウボーラー</span>
 <span class=a6>⑪ ブルーコンコルド</span>
 <span class=a6>⑫ トウショウギア</span>
△<span class=a7>⑬ タイムパラドックス</span>
◎<span class=a7>⑭ カネヒキリ</span>
 <span class=a8>⑮ タガノゲルニカ</span>
 <span class=a8>⑯ サンライズバッカス</span></div>


次に使うときにはこれをコピペしてお馬さんの名前を変えたりしてみて下さい^^;;;

最後に...Chocob予想^^;(競馬知らないので...名前で選んでみました^^;;;)


 ① リミットレスビッド
 ② タイキエニグマ
③ ユートピア
 ④ ニホンピロサート
 ⑤ スターキングマン
 ⑥ サカラート
 ⑦ アジュディミツオー
 ⑧ ヴァーミリアン
 ⑨ シーキングザダイヤ
 ⑩ メイショウボーラー
 ⑪ ブルーコンコルド
⑫ トウショウギア
 ⑬ タイムパラドックス
 ⑭ カネヒキリ
 ⑮ タガノゲルニカ
 ⑯ サンライズバッカス


選んだ理由...③ユートピア...メルヘンです^^
         ⑫トウショウギア...リチャードギア?
こんな選び方でした^^
色が微妙だったので^^;;も1個upです




 ① リミットレスビッド
 ② タイキエニグマ
 ③ ユートピア
 ④ ニホンピロサート
 ⑤ スターキングマン
 ⑥ サカラート
 ⑦ アジュディミツオー
 ⑧ ヴァーミリアン
⑨ シーキングザダイヤ
⑩ メイショウボーラー
 ⑪ ブルーコンコルド
 ⑫ トウショウギア
⑬ タイムパラドックス
⑭ カネヒキリ
 ⑮ タガノゲルニカ
 ⑯ サンライズバッカス

先ほどのCSSと入れ替えてください^^;;;
.a1 {color : #000000; background-color: #ffffff; }
.a2 {color : #ffffff; background-color: #000000; }
.a3 {color : #000000; background-color: #ff0000; }
.a4 {color : #000000; background-color: #0000ff; }
.a5 {color : #000000; background-color: #ffff00; }
.a6 {color : #000000; background-color: #008000; }
.a7 {color : #000000; background-color: #ffa500; }
.a8 {color : #000000; background-color: #ffcdff; }

[PR]
by chocobopapa | 2006-02-17 22:01 | スキン編集
2006年 02月 16日
Memorial No


きり番の記録です^^

皆様ありがとうございます<(_"_)>

3000番 Donny さま  

5000番 espoirrさま

5555番 chocob 自爆っぽいです;;









































































[PR]
by chocobopapa | 2006-02-16 15:47 | other

記事更新停止中です;;
by chocobopapa
    
since 2005.9.17
Count Down
Ranking

第10位

マイペース
SunSet Swish

第9位

Around The World
MONKEY MAJIK

第8位

恋のダウンロード
仲間由紀恵
with ダウンローズ

第7位

太陽の下
レミオロメン

第6位

Kiss Me Good-Bye
アンジェラ・アキ

第5位

Startin'/Born To Be...
浜崎あゆみ

第4位

SEXY BOY-そよ風に寄り添って-
モーニング娘。

第3位

純恋歌
湘南乃風

第2位

一剣
氷川きよし

第1位

サヤエンドウ
はだしのシンデレラボーイ
NEWS
Chocobo Style
    
以前の記事
    
カテゴリ
    
最新のトラックバック
美容
from 美容
Η(・∀・)イイ!!
from しんや
キッズコスメ
from キッズコスメ
負けても勝ち組w
from ドンパッチ
ホワイトツリー ビタフォ..
from 韓国コスメでべっぴん肌
スーヒャンスノー インテ..
from 韓国コスメでべっぴん肌
【化粧水】雪花秀 滋陰水
from 韓国コスメでべっぴん肌
韓国コスメ「雪花秀」に興..
from 韓国コスメが売れる理由
陸上 自衛隊のサイト集情報
from 陸上 自衛隊メンバー
横幅に戸惑った話 ~2年..
from ここから
    
フォロー中のブログ
    
その他のジャンル
    
ファン
    
記事ランキング
    
ブログジャンル
    
画像一覧
Copy Right Chocobo Style Since 2006