マウスオーバーで商品詳細を表示させるスクリプトをjQueryで作ってみた
要は、hover(), css(), animate() を使えばOKということで。
スマートフォンだったら hoverがないので、click(), toggle()にすれば良いですね。
考え方はこちらと同じ。
↓
Zoomer Gallery – A jQuery plugin for displaying images with Flash-like zooming effects
ということで、JETHRO TULL のディスコグラフィをこんな感じで作ってみました。ジャケット写真にマウスを持って行くと、収録曲が表れます。
- My Sunday Feeling
- Some Day the Sun Won’t Shine for You
- Beggar’s Farm
- Move on Alone
- Serenade to a Cuckoo
- Dharma for One
- It’s Breaking Me Up
- Cat’s Squirre
- A Song for Jeffrey
- Round
- A New Day Yesterday
- Jeffrey Goes to Leicester Square
- Bouree (J. S. Bach arr. Anderson)
- Back to the Family
- Look into the Sun
- Nothing Is Easy
- Fat Man
- We Used to Know
- Reasons for Waiting
- For a Thousand Mothers
- Living in the Past
- Driving Song
- Sweet Dream
- 17
- With You There to Help Me
- Nothing to Say
- Alive and Well and Living In
- Son
- For Michael Collins, Jeffrey and Me
- To Cry You a Song
- A Time for Everything?
- Inside
- Play in Time
- Sossity; You’re a Woman
- Singing All Day
- Witch’s Promise
- Just Trying To Be
- Teacher (original UK mix)
- Aqualung (Ian Anderson, Jennie Anderson)
- Cross-Eyed Mary
- Cheap Day Return
- Mother Goose
- Wond’ring Aloud
- Up to Me
- My God
- Hymn 43
- Slipstream
- Locomotive Breath
- Wind Up
- Lick Your Fingers Clean
- Wind Up (Quad Version)
- Excerpts From the Ian Anderson Interview (Mojo Magazine)
- A Song For Jeffrey (BBC)
- Fat Man (BBC)
- Bouree (BBC, written by Ian Anderson, Johann Sebastian Bach)
- Thick as a Brick, Part I
- Thick as a Brick, Part II
- Thick as a Brick (1978 live version at Madison Square Garden)
- Interview with Jethro Tull (Ian Anderson, Martin Barre and Jeffrey Hammond-Hammond)
- Lifebeats
- Prelude
- The Silver Cord
- Re-Assuring Tune
- Memory Bank
- Best Friends
- Critique Oblique
- Forest Dance #1
- The Story of the Hare Who Lost His Spectacles (Anderson / Hammond / Evan)
- Forest Dance #2
- The Foot of Our Stairs
- Overseer Overture
- Flight from Lucifer
- 10:08 to Paddington
- Magus Perde
- Epilogue
- The Story of the Hare Who Lost His Spectacles
- War Child
- Queen And Country
- Ladies
- Back-Door Angels
- Sealion
- Skating Away on the Thin Ice of the New Day
- Bungle in the Jungle
- Only Solitaire
- The Third Hoorah
- Two Fingers
- Warchild Waltz
- Quartet
- Paradise Steakhouse
- SeaLion 2
- Rainbow Blues
- Glory Row
- Saturation
- Minstrel in the Gallery
- Cold Wind to Valhalla
- Black Satin Dancer
- Requiem
- One White Duck / 010 = Nothing At All
- Baker St. Muse
- Grace
- Summerday Sands
- March the Mad Scientist
- Pan Dance
- Minstrel in the Gallery – Live
- Cold Wind to Valhalla – Live
- Quizz Kid
- Crazed Institution
- Salamander
- Taxi Grab
- From a Dead Beat to an Old Greaser
- Bad-Eyed ‘n’ Loveless
- Big Dipper
- Too Old to Rock ‘n’ Roll, Too Young to Die
- Pied Piper
- The Chequered Flag (Dead or Alive)
- A Small Cigar
- Strip Cartoon
- Songs from the Wood
- Jack-in-the-Green
- Cup of Wonder
- Hunting Girl
- Ring Out, Solstice Bells
- Velvet Green
- The Whistler
- Pibroch (Cap in Hand)
- Fire at Midnight
- Beltane
- Velvet Green (Live)
- …And the Mouse Police Never Sleeps
- Acres Wild
- No Lullaby
- Moths
- Journeyman
- Rover
- One Brown Mouse
- Heavy Horses
- Weathercock
- Living in These Hard Times
- Broadford Bazaar
- North Sea Oil
- Orion
- Home
- Dark Ages
- Warm Sporran
- Something’s on the Move
- Old Ghosts
- Dun Ringill
- Flying Dutchman
- Elegy (Instrumental, David Palmer)
- A Stitch in Time
- Crossword
- Kelpie
- King Henry’s Madrigal (King Henry VIII)
- Crossfire
- Fylingdale flyer
- Working John, working Joe
- Black Sunday
- Protect and Survive
- Batteries Not Included
- Uniform
- 4.W.D. (Low Ratio)
- The Pine Marten’s Jig
- And Further On
- Beastie
- Clasp
- Fallen On Hard Times
- Flying Colours
- Slow Marching Band
- Broadsword
- Pussy Willow
- Watching Me Watching You
- Seal Driver
- Cheerio
- Jack Frost and the Hooded Crow
- Jack A Lynn
- Mayhem Maybe
- Too Many Too
- Overhang
- Rhythm in Gold
- I Am Your Gun
- Down At the End of Your Road
- Lap Of Luxury
- Under Wraps #1
- European Legacy
- Later, That Same Evening
- Saboteur
- Radio Free Moscow
- Astronomy
- Tundra
- Nobody’s Car
- Heat
- Under Wraps #2
- Paparazzi
- Apogee
- Automotive Engineering
- General Crossing
- Steel Monkey
- Farm On The Freeway
- Jump Start
- Said She Was A Dancer
- Dogs In The Midwinter
- Budapest
- Mountain Men
- The Waking Edge
- Raising Steam
- Kissing Willie
- The Rattlesnake Trail
- Ears of Tin
- Undressed to Kill
- Rock Island
- Heavy Water
- Another Christmas Song
- The Whaler’s Dues
- Big Riff and Mando
- Strange Avenues
- A Christmas Song
- Cheap Day Return / Mother Goose
- Locomotive Breath
- This Is Not Love
- Occasional Demons
- Roll Yer Own
- Rocks On The Road
- Sparrow On The Schoolyard Wall
- Thinking Round Corners
- Still Loving You Tonight
- Doctor To My Disease
- Like A Tall Thin Girl
- White Innocence
- Sleeping With The Dog
- Gold-Tipped Boots, Black Jacket And Tie
- When Jesus Came To Play
- Night in the Wilderness
- Jump Start (live)
- Roots To Branches
- Rare And Precious Chain
- Out Of The Noise
- This Free Will
- Valley
- Dangerous Veils
- Beside Myself
- Wounded, Old And Treacherous
- At Last, Forever
- Stuck In The August Rain
- Another Harry’s Bar
- Spiral
- Dot Com
- AWOL
- Nothing @ All (Giddings)
- Wicked Windows
- Hunt By Numbers
- Hot Mango Flush (Anderson – Barre)
- El Nino
- Black Mamba
- Mango Surprise
- Bends Like A Willow
- Far Alaska
- The Dog-Ear Years
- A Gift Of Roses
- Birthday Card at Christmas
- Holly Herald
- A Christmas Song
- Another Christmas Song
- God Rest Ye Merry, Gentlemen
- Jack Frost and the Hooded Crow
- Last Man at the Party
- Weathercock
- Pavane
- First Snow on Brooklyn
- Greensleeved
- Fire at Midnight
- We Five Kings
- Ring Out Solstice Bells
- Bouree
- A Winter Snowscape
コードはこちら ↓css
div#test20111110 {
width:400px;
list-style-type:none;
margin:50px auto;
}
div#test20111110 div.title {
float:left;
width:100px;
height:100px;
text-align:left;
}
div#test20111110 img {
height:95px;
width:95px;
vertical-align:top;
position:absolute;
z-index:1;
}
div#test20111110 div.detail {
position:absolute;
z-index:2;
background:#fff;
border:1px solid #666;
padding:10px;
margin:95px 0 0 -30px;
display:none;
width:300px
}
div#test20111110 ol {
margin:1em 0 0 2em;
padding:0;
}
↓html
<div id="test20111110"> <div class="title"> <img src="http://static.pixelpipe.com/68386931-73ae-4c7b-9b7f-a2c01379d0db.jpg" /> <div class="detail"> <a href="http://en.wikipedia.org/wiki/This_Was" target="_blank">1968 This Was</a> <ol> <li>My Sunday Feeling</li> <li>Some Day the Sun Won't Shine for You</li> <li>Beggar's Farm</li> <li>Move on Alone</li> <li>Serenade to a Cuckoo</li> <li>Dharma for One</li> <li>It's Breaking Me Up</li> <li>Cat's Squirre</li> <li>A Song for Jeffrey</li> <li>Round</li> </ol> </div> </div> <div class="title"> <img src="http://static.pixelpipe.com/7bd646fc-8551-45f1-8c49-b418b29aeb6c.jpg" /> <div class="detail"> <a href="http://en.wikipedia.org/wiki/Stand_Up_%28Jethro_Tull_album%29" target="_blank">1969 Stand Up</a> <ol> <li>A New Day Yesterday</li> <li>Jeffrey Goes to Leicester Square</li> <li>Bouree (J. S. Bach arr. Anderson)</li> <li>Back to the Family</li> <li>Look into the Sun</li> <li>Nothing Is Easy</li> <li>Fat Man</li> <li>We Used to Know</li> <li>Reasons for Waiting</li> <li>For a Thousand Mothers</li> <li>Living in the Past</li> <li>Driving Song</li> <li>Sweet Dream</li> <li>17</li> </ol> </div> </div> <div class="title"> <img src="http://static.pixelpipe.com/eb1bd2d8-d9e1-4dfa-a0b5-dc346aa0c39c.jpg" /> <div class="detail"> <a href="http://en.wikipedia.org/wiki/Benefit_(album)" target="_blank">1970 Benefit</a> <ol> <li>With You There to Help Me</li> <li>Nothing to Say</li> <li>Alive and Well and Living In</li> <li>Son</li> <li>For Michael Collins, Jeffrey and Me</li> <li>To Cry You a Song</li> <li>A Time for Everything?</li> <li>Inside</li> <li>Play in Time</li> <li>Sossity; You're a Woman</li> <li>Singing All Day</li> <li>Witch's Promise</li> <li>Just Trying To Be</li> <li>Teacher (original UK mix)</li> </ol> </div> </div> <div class="title"> <img src="http://static.pixelpipe.com/b327e7a0-71b7-4d88-92ec-14d8a9d21c97.jpg" /> <div class="detail"> <a href="http://en.wikipedia.org/wiki/Aqualung_%28Jethro_Tull_album%29" target="_blank">1971 Aqualung</a> <ol> <li>Aqualung (Ian Anderson, Jennie Anderson)</li> <li>Cross-Eyed Mary</li> <li>Cheap Day Return</li> <li>Mother Goose</li> <li>Wond'ring Aloud</li> <li>Up to Me</li> <li>My God</li> <li>Hymn 43</li> <li>Slipstream</li> <li>Locomotive Breath</li> <li>Wind Up</li> <li>Lick Your Fingers Clean</li> <li>Wind Up (Quad Version)</li> <li>Excerpts From the Ian Anderson Interview (Mojo Magazine)</li> <li>A Song For Jeffrey (BBC)</li> <li>Fat Man (BBC)</li> <li>Bouree (BBC, written by Ian Anderson, Johann Sebastian Bach)</li> </ol> </div> </div> <div class="title"> <img src="http://static.pixelpipe.com/711c09c1-b0ae-4a6b-81a4-45df22e6f560.jpg" /> <div class="detail"> <a href="http://en.wikipedia.org/wiki/Thick_as_a_Brick" target="_blank">1972 Thick as a Brick</a> <ol> <li>Thick as a Brick, Part I</li> <li>Thick as a Brick, Part II</li> <li>Thick as a Brick (1978 live version at Madison Square Garden)</li> <li>Interview with Jethro Tull (Ian Anderson, Martin Barre and Jeffrey Hammond-Hammond)</li> </ol> </div> </div> <div class="title"> <img src="http://static.pixelpipe.com/e8bb6aaa-8ba0-4547-a912-b74b25baa92f.jpg" /> <div class="detail"> <a href="http://en.wikipedia.org/wiki/A_Passion_Play" target="_blank">1973 A Passion Play</a> <ol> <li>Lifebeats</li> <li>Prelude</li> <li>The Silver Cord</li> <li>Re-Assuring Tune</li> <li>Memory Bank</li> <li>Best Friends</li> <li>Critique Oblique</li> <li>Forest Dance #1</li> <li>The Story of the Hare Who Lost His Spectacles (Anderson / Hammond / Evan)</li> <li>Forest Dance #2</li> <li>The Foot of Our Stairs</li> <li>Overseer Overture</li> <li>Flight from Lucifer</li> <li>10:08 to Paddington</li> <li>Magus Perde</li> <li>Epilogue</li> <li>The Story of the Hare Who Lost His Spectacles</li> </ol> </div> </div> <div class="title"> <img src="http://static.pixelpipe.com/6ffcd23e-90db-4c8a-82e6-129a68bc3671.jpg" /> <div class="detail"> <a href="http://en.wikipedia.org/wiki/War_Child_%28album%29" target="_blank">1974 War Child</a> <ol> <li>War Child</li> <li>Queen And Country</li> <li>Ladies</li> <li>Back-Door Angels</li> <li>Sealion</li> <li>Skating Away on the Thin Ice of the New Day</li> <li>Bungle in the Jungle</li> <li>Only Solitaire</li> <li>The Third Hoorah</li> <li>Two Fingers</li> <li>Warchild Waltz</li> <li>Quartet</li> <li>Paradise Steakhouse</li> <li>SeaLion 2</li> <li>Rainbow Blues</li> <li>Glory Row</li> <li>Saturation</li> </ol> </div> </div> <div class="title"> <img src="http://static.pixelpipe.com/61066e63-5b7a-4274-94c5-64ba3a3ade50.jpg" /> <div class="detail"> <a href="http://en.wikipedia.org/wiki/Minstrel_in_the_Gallery" target="_blank">1975 Minstrel in the Gallery</a> <ol> <li>Minstrel in the Gallery</li> <li>Cold Wind to Valhalla</li> <li>Black Satin Dancer</li> <li>Requiem</li> <li>One White Duck / 010 = Nothing At All</li> <li>Baker St. Muse</li> <li>Grace</li> <li>Summerday Sands</li> <li>March the Mad Scientist</li> <li>Pan Dance</li> <li>Minstrel in the Gallery - Live</li> <li>Cold Wind to Valhalla - Live</li> </ol> </div> </div> <div class="title"> <img src="http://static.pixelpipe.com/a4405053-576c-4738-9d1d-e45b9892bc94.jpg" /> <div class="detail"> <a href="http://en.wikipedia.org/wiki/Too_Old_to_Rock_%27n%27_Roll:_Too_Young_to_Die!" target="_blank">1976 Too Old to Rock 'n' Roll: Too Young to Die!</a> <ol> <li>Quizz Kid</li> <li>Crazed Institution</li> <li>Salamander</li> <li>Taxi Grab</li> <li>From a Dead Beat to an Old Greaser</li> <li>Bad-Eyed 'n' Loveless</li> <li>Big Dipper</li> <li>Too Old to Rock 'n' Roll, Too Young to Die</li> <li>Pied Piper</li> <li>The Chequered Flag (Dead or Alive)</li> <li>A Small Cigar</li> <li>Strip Cartoon</li> </ol> </div> </div> <div class="title"> <img src="http://static.pixelpipe.com/19c9ef83-0726-412b-aa0b-bff2abcbefbe.jpg" /> <div class="detail"> <a href="http://en.wikipedia.org/wiki/Songs_from_the_Wood" target="_blank">1977 Songs from the Wood</a> <ol> <li>Songs from the Wood</li> <li>Jack-in-the-Green</li> <li>Cup of Wonder</li> <li>Hunting Girl</li> <li>Ring Out, Solstice Bells</li> <li>Velvet Green</li> <li>The Whistler</li> <li>Pibroch (Cap in Hand)</li> <li>Fire at Midnight</li> <li>Beltane</li> <li>Velvet Green (Live)</li> </ol> </div> </div> <div class="title"> <img src="http://static.pixelpipe.com/d6fa9a5e-5a61-4402-ac42-147fa1438d17.jpg" /> <div class="detail"> <a href="http://en.wikipedia.org/wiki/Heavy_Horses" target="_blank">1978 Heavy Horses</a> <ol> <li>...And the Mouse Police Never Sleeps</li> <li>Acres Wild</li> <li>No Lullaby</li> <li>Moths</li> <li>Journeyman</li> <li>Rover</li> <li>One Brown Mouse</li> <li>Heavy Horses</li> <li>Weathercock</li> <li>Living in These Hard Times</li> <li>Broadford Bazaar</li> </ol> </div> </div> <div class="title"> <img src="http://static.pixelpipe.com/056a8f6d-7ca2-4d12-852e-be14398d4049.jpg" /> <div class="detail"> <a href="http://en.wikipedia.org/wiki/Stormwatch_%28album%29" target="_blank">1979 Stormwatch</a> <ol> <li>North Sea Oil</li> <li>Orion</li> <li>Home</li> <li>Dark Ages</li> <li>Warm Sporran</li> <li>Something's on the Move</li> <li>Old Ghosts</li> <li>Dun Ringill</li> <li>Flying Dutchman</li> <li>Elegy (Instrumental, David Palmer)</li> <li>A Stitch in Time</li> <li>Crossword</li> <li>Kelpie</li> <li>King Henry's Madrigal (King Henry VIII)</li> </ol> </div> </div> <div class="title"> <img src="http://static.pixelpipe.com/0d9c1b40-caca-4093-b8da-667ab41ca2f5.jpg" /> <div class="detail"> <a href="http://en.wikipedia.org/wiki/A_%28Jethro_Tull_album%29" target="_blank">1980 A</a> <ol> <li>Crossfire</li> <li>Fylingdale flyer</li> <li>Working John, working Joe</li> <li>Black Sunday</li> <li>Protect and Survive</li> <li>Batteries Not Included</li> <li>Uniform</li> <li>4.W.D. (Low Ratio)</li> <li>The Pine Marten's Jig</li> <li>And Further On</li> </ol> </div> </div> <div class="title"> <img src="http://static.pixelpipe.com/3f232bc4-7441-4368-99e2-0840834e8ce3.jpg" /> <div class="detail"> <a href="http://en.wikipedia.org/wiki/Broadsword_and_the_Beast" target="_blank">1982 The Broadsword and the Beast</a> <ol> <li>Beastie</li> <li>Clasp</li> <li>Fallen On Hard Times</li> <li>Flying Colours</li> <li>Slow Marching Band</li> <li>Broadsword</li> <li>Pussy Willow</li> <li>Watching Me Watching You</li> <li>Seal Driver</li> <li>Cheerio</li> <li>Jack Frost and the Hooded Crow</li> <li>Jack A Lynn</li> <li>Mayhem Maybe</li> <li>Too Many Too</li> <li>Overhang</li> <li>Rhythm in Gold</li> <li>I Am Your Gun</li> <li>Down At the End of Your Road</li> </ol> </div> </div> <div class="title"> <img src="http://static.pixelpipe.com/be6bf38b-755f-4485-854f-465dda2f62c2.jpg" /> <div class="detail"> <a href="http://en.wikipedia.org/wiki/Under_Wraps_%28Jethro_Tull_album%29" target="_blank">1984 Under Wraps</a> <ol> <li>Lap Of Luxury</li> <li>Under Wraps #1</li> <li>European Legacy</li> <li>Later, That Same Evening</li> <li>Saboteur</li> <li>Radio Free Moscow</li> <li>Astronomy</li> <li>Tundra</li> <li>Nobody's Car</li> <li>Heat</li> <li>Under Wraps #2</li> <li>Paparazzi</li> <li>Apogee</li> <li>Automotive Engineering</li> <li>General Crossing</li> </ol> </div> </div> <div class="title"> <img src="http://static.pixelpipe.com/8b0eb1c4-e8ad-41ca-8ab5-3c357fa0e0d6.jpg" /> <div class="detail"> <a href="http://en.wikipedia.org/wiki/Crest_of_a_Knave" target="_blank">1987 Crest of a Knave</a> <ol> <li>Steel Monkey</li> <li>Farm On The Freeway</li> <li>Jump Start</li> <li>Said She Was A Dancer</li> <li>Dogs In The Midwinter</li> <li>Budapest</li> <li>Mountain Men</li> <li>The Waking Edge</li> <li>Raising Steam</li> </ol> </div> </div> <div class="title"> <img src="http://static.pixelpipe.com/b87a64d1-859a-4c70-81c0-1fb00abe168c.jpg" /> <div class="detail"> <a href="http://en.wikipedia.org/wiki/Rock_Island_%28album%29" target="_blank">1989 Rock Island</a> <ol> <li>Kissing Willie</li> <li>The Rattlesnake Trail</li> <li>Ears of Tin</li> <li>Undressed to Kill</li> <li>Rock Island</li> <li>Heavy Water</li> <li>Another Christmas Song</li> <li>The Whaler's Dues</li> <li>Big Riff and Mando</li> <li>Strange Avenues</li> <li>A Christmas Song</li> <li>Cheap Day Return / Mother Goose</li> <li>Locomotive Breath</li> </ol> </div> </div> <div class="title"> <img src="http://static.pixelpipe.com/2739a2d8-28b8-4394-92fb-b2e0625616e3.jpg" /> <div class="detail"> <a href="http://en.wikipedia.org/wiki/Catfish_Rising" target="_blank">1991 Catfish Rising</a> <ol> <li>This Is Not Love</li> <li>Occasional Demons</li> <li>Roll Yer Own</li> <li>Rocks On The Road</li> <li>Sparrow On The Schoolyard Wall</li> <li>Thinking Round Corners</li> <li>Still Loving You Tonight</li> <li>Doctor To My Disease</li> <li>Like A Tall Thin Girl</li> <li>White Innocence</li> <li>Sleeping With The Dog</li> <li>Gold-Tipped Boots, Black Jacket And Tie</li> <li>When Jesus Came To Play</li> <li>Night in the Wilderness</li> <li>Jump Start (live)</li> </ol> </div> </div> <div class="title"> <img src="http://static.pixelpipe.com/00120f4f-22e1-4b75-a389-5b8102c915e3.jpg" /> <div class="detail"> <a href="http://en.wikipedia.org/wiki/Roots_to_Branches" target="_blank">1995 Roots to Branches</a> <ol> <li>Roots To Branches</li> <li>Rare And Precious Chain</li> <li>Out Of The Noise</li> <li>This Free Will</li> <li>Valley</li> <li>Dangerous Veils</li> <li>Beside Myself</li> <li>Wounded, Old And Treacherous</li> <li>At Last, Forever</li> <li>Stuck In The August Rain</li> <li>Another Harry's Bar</li> </ol> </div> </div> <div class="title"> <img src="http://static.pixelpipe.com/cc46f2ee-927a-452e-80e9-224389f10969.jpg" /> <div class="detail"> <a href="http://en.wikipedia.org/wiki/J-Tull_Dot_Com" target="_blank">1999 J-Tull Dot Com</a> <ol> <li>Spiral</li> <li>Dot Com</li> <li>AWOL</li> <li>Nothing @ All (Giddings)</li> <li>Wicked Windows</li> <li>Hunt By Numbers</li> <li>Hot Mango Flush (Anderson - Barre)</li> <li>El Nino</li> <li>Black Mamba</li> <li>Mango Surprise</li> <li>Bends Like A Willow</li> <li>Far Alaska</li> <li>The Dog-Ear Years</li> <li>A Gift Of Roses</li> </ol> </div> </div> <div class="title"> <img src="http://static.pixelpipe.com/1d522bf8-c180-4954-98c5-87bf55e20a3d.jpg" /> <div class="detail"> <a href="http://en.wikipedia.org/wiki/The_Jethro_Tull_Christmas_Album" target="_blank">2003 The Jethro Tull Christmas Album</a> <ol> <li>Birthday Card at Christmas</li> <li>Holly Herald</li> <li>A Christmas Song</li> <li>Another Christmas Song</li> <li>God Rest Ye Merry, Gentlemen</li> <li>Jack Frost and the Hooded Crow</li> <li>Last Man at the Party</li> <li>Weathercock</li> <li>Pavane</li> <li>First Snow on Brooklyn</li> <li>Greensleeved</li> <li>Fire at Midnight</li> <li>We Five Kings</li> <li>Ring Out Solstice Bells</li> <li>Bouree</li> <li>A Winter Snowscape</li> </ol> </div> </div> </div> <br style="clear:both" />↓js
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$("div.title").hover(
function(){
$("img",this)
.css({"zIndex":"2","boxShadow":"0 0 15px #000"})
.animate({width:"155px",height:"155px",marginLeft:"-30px",marginTop:"-30px"},400);
$("div.detail",this)
.css("display","block")
.animate({marginLeft:"-30px",marginTop:"120px"},400);
},
function(){
$("img",this)
.css({"zIndex":"1","boxShadow":"none"})
.animate({width:"95px",height:"95px",marginLeft:"0",marginTop:"0"},200);
$("div.detail",this)
.css("display","none")
.animate({marginLeft:"-30px",marginTop:"95px"},400);
}
)
</script>
IEにも対応していて、jQuery開発者には感謝です。


