▼左右のサムネイルをクリックすると、中央に拡大画像と説明文が表示されます。
よくわからないけどちゃんとアボガド入りです!クリーミーなシーザードレッシングとアボガドの相性がとってもよかったです。
アボガドにお醤油がかかってるせいか、わさびをちょっとのせて食べると、マグロ入ってないのに、マグロの味がしましたw
アボカドディップはとってもクリーミー!ポテトじゃなくてもなんにでも合いそう♪
めちゃくちゃおいしかったアボカドのピザ!ピザ生地はクリスピータイプでさくさく!
アボカドたっぷしのってますが、れっきとしたデザートです。ハニートーストの上にバニラアイスが乗っていて、その上にアボガドがぱらぱらと。アボカドっぽくなくて、どちらかといえば栗のような味がしました!
昆布の上に白子をのせて、かるーく火を通ったところで、お醤油をちょびっとたらしていただききました。白子って生でポン酢で食べることが多いけど、焼いてもトロットしてて美味しいんですねー!
ジューシーなササミに、ちょっぴりわさびのきいたマヨネーズがたっぷりのってまっす!和とイタリアンの融合って感じw彩りもきれいですよね♪
メニューの名前をわすれてしまった(汗;鶏肉を骨ごとぶつ切りにしてあげた唐揚げ!衣にしっかり味がついていて、食べた感じはカラッよりもふっくら!肉汁があふれでますw
またまたリピしちゃいました、白レバー!今回は3人で行ったので3本。お刺身でもいけるくらい新鮮で美味しいレバーなので、レアめな感じの焼き加減に、濃厚な味噌ソースがたっぷり!コレは絶品です!
焼きラーメンってなんだろー??と思って頼んでみました。普通の焼きそばと違って、麺がやわらかめでソースが下にたまるくらいかかっていました!呑んでると、濃い目の味付けがほしくなるんですよね。そんなときにぴったりの〆メニューです!
えいひれ大好きなんだけど、これは今まで食べたことがない感じで美味しかった!ジューシーといういかとっても肉厚でやわらかいんですよねー!日本酒の肴にもってこい♪
中身は芋焼酎ですw高庵は、グラスがとってもお洒落!頼むたびに、お酒に合ったデザインのグラスに入れてくれるので、お酒もグラスも楽しめます。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="Content-Language" content="ja" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta http-equiv="imagetoolbar" content="no" /> <title>simplyScroll | 設置サンプル</title> <link rel="stylesheet" type="text/css" href="/content/lib/global.css" /> <!-- JS --> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" ></script> <script type="text/javascript" src="/content/lib/jquery/jquery.easing.1.3.js"></script> <script type="text/javascript"> $(function(){ var hght = 0; $('dt') .addClass('dt') .each(function(i){ if(i%2){ $(this).addClass('left').css('top',hght); hght+=75; } else{ $(this).addClass('right').css('top',hght); } }) .click(function(){ if( $('#portfolio dd:animated').size()) return false; var that = $(this); $('#portfolio dd.showing') .animate({top:-455}, 750, 'easeOutQuad', function(){ $(this).removeClass('showing'); that.next().animate({top:0}, 750, 'easeInQuad').addClass('showing'); }); }) .eq(0) .next() .animate({top:0}, 750, 'easeInQuad').addClass('showing'); }); </script> <!-- CSS --> <style type="text/css"> #demo { width:850px; height:450px; overflow:hidden; position:relative; } #portfolio { margin:0; padding:0; } #portfolio dt { width:240px; height:65px; background:#333; font-weight:normal; color:#999; margin:0; padding:5px; letter-spacing:-1px; } #portfolio dd { position:absolute; left:250px; top:-455px; width:330px; height:430px; margin:0; padding:0; background:#000; padding:10px; } #portfolio dt img { border:2px solid #fff; width:55px; height:55px; float:left; margin-right:5px; } #portfolio dt strong { display:block; color:#e8e8e8; margin:0; padding:0; font-size:1.2em; font-weight:bold; text-decoration:none; } #portfolio dt.left { position:absolute; top:0; left:0; font-size:.8em; } #portfolio dt.right { position:absolute; top:0; right:0; font-size:.8em; } #portfolio dd h3 { color:#fff; font-size:1.3em; margin:0; padding:0; } #portfolio dd h4 { font-size:1.1em; color:#fff; margin:0; padding:0; } #portfolio dd p { color:#fff; font-size:.9em; line-height:1.5; } #portfolio dd img{ display:block; margin:0 auto; border:3px solid #999; } </style> <link rel="stylesheet" type="text/css" href="/common/css/example.css"></head> <body id='example3' class='example'><div class="ads" style="margin:32px auto;text-align:center;"></div><h1 class='h'><a href='/'>PHP & JavaScript Room</a> :: 設置サンプル</h1> <h3 class='h'>実行結果</h3> <div id="wrap"> <h1><a href='http://benjaminsterling.com/portolio-layout-idea-using-jquery/'>Portfolio Layout Idea Using jQuery</a> | 設置サンプル</h1> <p>▼左右のサムネイルをクリックすると、中央に拡大画像と説明文が表示されます。</p> <!-- CODE --> <div id="demo" class="cf"> <dl id="portfolio"> <dt> <img src="http://farm4.static.flickr.com/3514/3274514408_1800118ded_s.jpg" alt="" /> <strong>アボカド シーザーサラダ</strong> @アボガドダイニング Platinum Lounge </dt> <dd> <h3><span>メニュー:</span> アボカド シーザーサラダ</h3> <h4><span>お店:</span> @アボガドダイニング Platinum Lounge</h4> <p>よくわからないけどちゃんとアボガド入りです!クリーミーなシーザードレッシングとアボガドの相性がとってもよかったです。</p> <img src="http://farm4.static.flickr.com/3514/3274514408_1800118ded_m.jpg" alt="" /> </dd> <dt> <img src="http://farm4.static.flickr.com/3509/3273696567_ebf4ed4381_s.jpg" alt="" /> <strong>アボカド刺</strong> @アボガドダイニング Platinum Lounge </dt> <dd> <h3><span>メニュー:</span> アボカド刺</h3> <h4><span>お店:</span> @アボガドダイニング Platinum Lounge</h4> <p>アボガドにお醤油がかかってるせいか、わさびをちょっとのせて食べると、マグロ入ってないのに、マグロの味がしましたw</p> <img src="http://farm4.static.flickr.com/3509/3273696567_ebf4ed4381_m.jpg" alt="" /> </dd> <dt> <img src="http://farm4.static.flickr.com/3324/3273696401_f4ea6c7677_s.jpg" alt="" /> <strong>フライドポテト アボカドディップ添え</strong> @アボガドダイニング Platinum Lounge </dt> <dd> <h3><span>メニュー:</span> フライドポテト アボカドディップ添え</h3> <h4><span>お店:</span> @アボガドダイニング Platinum Lounge</h4> <p>アボカドディップはとってもクリーミー!ポテトじゃなくてもなんにでも合いそう♪</p> <img src="http://farm4.static.flickr.com/3324/3273696401_f4ea6c7677_m.jpg" alt="" /> </dd> <dt> <img src="http://farm4.static.flickr.com/3427/3273696469_aa2aaf5e89_s.jpg" alt="" /> <strong>ベーコンとアボカドのピザ(トマトソース)</strong> @アボガドダイニング Platinum Lounge </dt> <dd> <h3><span>メニュー:</span> ベーコンとアボカドのピザ(トマトソース)</h3> <h4><span>お店:</span> @アボガドダイニング Platinum Lounge</h4> <p>めちゃくちゃおいしかったアボカドのピザ!ピザ生地はクリスピータイプでさくさく!</p> <img src="http://farm4.static.flickr.com/3427/3273696469_aa2aaf5e89_m.jpg" alt="" /> </dd> <dt> <img src="http://farm4.static.flickr.com/3316/3273696493_570fdd0ee5_s.jpg" alt="" /> <strong>ハニートースト</strong> @アボガドダイニング Platinum Lounge </dt> <dd> <h3><span>メニュー:</span> ハニートースト</h3> <h4><span>お店:</span> @アボガドダイニング Platinum Lounge</h4> <p>アボカドたっぷしのってますが、れっきとしたデザートです。ハニートーストの上にバニラアイスが乗っていて、その上にアボガドがぱらぱらと。アボカドっぽくなくて、どちらかといえば栗のような味がしました!</p> <img src="http://farm4.static.flickr.com/3316/3273696493_570fdd0ee5_m.jpg" alt="" /> </dd> <dt> <img src="http://farm4.static.flickr.com/3197/3141927210_be00d22544_s.jpg" alt="" /> <strong>白子の昆布焼き</strong> @高庵 </dt> <dd> <h3><span>メニュー:</span> 白子の昆布焼き</h3> <h4><span>お店:</span> 高庵</h4> <p>昆布の上に白子をのせて、かるーく火を通ったところで、お醤油をちょびっとたらしていただききました。白子って生でポン酢で食べることが多いけど、焼いてもトロットしてて美味しいんですねー!</p> <img src="http://farm4.static.flickr.com/3197/3141927210_be00d22544_m.jpg" alt="" /> </dd> <dt> <img src="http://farm4.static.flickr.com/3284/3141927120_d66a9a0304_s.jpg" alt="" /> <strong>ササミ焼わさびマヨネーズ</strong> @高庵 </dt> <dd> <h3><span>メニュー:</span> ササミ焼わさびマヨネーズ</h3> <h4><span>お店:</span> 高庵</h4> <p>ジューシーなササミに、ちょっぴりわさびのきいたマヨネーズがたっぷりのってまっす!和とイタリアンの融合って感じw彩りもきれいですよね♪</p> <img src="http://farm4.static.flickr.com/3284/3141927120_d66a9a0304_m.jpg" alt="" /> </dd> <dt> <img src="http://farm4.static.flickr.com/3196/3141100631_c244dbe4a4_s.jpg" alt="" /> <strong>揚げ物</strong> @高庵 </dt> <dd> <h3><span>メニュー:</span> 揚げ物</h3> <h4><span>お店:</span> 高庵</h4> <p>メニューの名前をわすれてしまった(汗;鶏肉を骨ごとぶつ切りにしてあげた唐揚げ!衣にしっかり味がついていて、食べた感じはカラッよりもふっくら!肉汁があふれでますw</p> <img src="http://farm4.static.flickr.com/3196/3141100631_c244dbe4a4_m.jpg" alt="" /> </dd> <dt> <img src="http://farm4.static.flickr.com/3215/3141100545_e21269fb11_s.jpg" alt="" /> <strong>白レバー串みそ焼き</strong> @高庵 </dt> <dd> <h3><span>メニュー:</span> 揚げ物</h3> <h4><span>お店:</span> 高庵</h4> <p>またまたリピしちゃいました、白レバー!今回は3人で行ったので3本。お刺身でもいけるくらい新鮮で美味しいレバーなので、レアめな感じの焼き加減に、濃厚な味噌ソースがたっぷり!コレは絶品です!</p> <img src="http://farm4.static.flickr.com/3215/3141100545_e21269fb11_m.jpg" alt="" /> </dd> <dt> <img src="http://farm4.static.flickr.com/3247/3141926720_08ebc48824_s.jpg" alt="" /> <strong>屋台風羽根つき焼きラーメン</strong> @高庵 </dt> <dd> <h3><span>メニュー:</span> 屋台風羽根つき焼きラーメン</h3> <h4><span>お店:</span> 高庵</h4> <p>焼きラーメンってなんだろー??と思って頼んでみました。普通の焼きそばと違って、麺がやわらかめでソースが下にたまるくらいかかっていました!呑んでると、濃い目の味付けがほしくなるんですよね。そんなときにぴったりの〆メニューです!</p> <img src="http://farm4.static.flickr.com/3247/3141926720_08ebc48824_m.jpg" alt="" /> </dd> <dt> <img src="http://farm4.static.flickr.com/3278/3141100261_e0139b971e_s.jpg" alt="" /> <strong>えいひれ</strong> @高庵 </dt> <dd> <h3><span>メニュー:</span> えいひれ</h3> <h4><span>お店:</span> 高庵</h4> <p>えいひれ大好きなんだけど、これは今まで食べたことがない感じで美味しかった!ジューシーといういかとっても肉厚でやわらかいんですよねー!日本酒の肴にもってこい♪</p> <img src="http://farm4.static.flickr.com/3278/3141100261_e0139b971e_m.jpg" alt="" /> </dd> <dt> <img src="http://farm4.static.flickr.com/3031/3141100435_24ebb86016_s.jpg" alt="" /> <strong>芋焼酎とグラス</strong> @高庵 </dt> <dd> <h3><span>メニュー:</span> 芋焼酎とグラス</h3> <h4><span>お店:</span> 高庵</h4> <p>中身は芋焼酎ですw高庵は、グラスがとってもお洒落!頼むたびに、お酒に合ったデザインのグラスに入れてくれるので、お酒もグラスも楽しめます。</p> <img src="http://farm4.static.flickr.com/3031/3141100435_24ebb86016_m.jpg" alt="" /> </dd> </dl> </div> <!-- / CODE --> </div> </body> </html>