Accordion pictures of jquery

<! DOCTYPE html>"http://www.w3.org/1999/xhtml">"Content-type"Content="text/html; Charset=utf-8"/> <title>jquery Accordion Pictures </title> <Basetarget="_blank"/> <style>#cdp*{margin:0; padding:0; } #cdp ul {list-Style:none; } #cdp a {text-Decoration:none;        } #cdp img {border:none;            } #cdp {width:845px;            height:320px;            Overflow:hidden;            margin:80px Auto; Box-shadow:0 010px 2px Rgba (0,0,0,0.4);            } #cdp ul {width:3000px;                } #cdp li {display:block;                width:140px;                height:320px;                position:relative; float: Left; Border-left:1px solid #aaa; Box-shadow:0 025px 10px Rgba (0,0,0,0.4); -moz-transition:all0. 5s; -webkit-transition:all0. 5s; Transition:all0. 5s;                    } #cdp li img {display:block;                width:640px;            } #cdp ul:hover li {width:40px;            } #cdp ul li:hover {width:640px;                } #cdp. title {position:absolute; Left:0; Bottom:0;                width:640px; Background:rgba (0,0,0,0.5);                    } #cdp. Title a {display:block;                    Color: #fff; Font-size:16px;                padding:20px; }    </style>'CDP'> <ul> <li> <divclass='title'> <a href="http://www.cnblogs.com/caidupingblogs/gallery/818864.html">bigbang-001</a> </div> 'http://images.cnblogs.com/cnblogs_com/caidupingblogs/818864/o_bigbang-001.jpg'> </li> <li> <divclass='title'> <a href="http://www.cnblogs.com/caidupingblogs/gallery/818864.html">bigbang-002</a> </div> 'http://images.cnblogs.com/cnblogs_com/caidupingblogs/818864/o_bigbang-003.jpg'> </li> <li> <divclass='title'> <a href="http://www.cnblogs.com/caidupingblogs/gallery/818864.html">bigbang-003</a> </div> 'http://images.cnblogs.com/cnblogs_com/caidupingblogs/818864/o_bigbang-005.jpg'> </li> <li> <divclass='title'> <a href="http://www.cnblogs.com/caidupingblogs/gallery/818864.html">bigbang-004</a> </div> 'http://images.cnblogs.com/cnblogs_com/caidupingblogs/818864/o_bigbang-006.jpg'> </li> <li> <divclass='title'> <a href="http://www.cnblogs.com/caidupingblogs/gallery/818864.html">bigbang-005</a> </div> 'http://images.cnblogs.com/cnblogs_com/caidupingblogs/818864/o_bigbang-002.jpg'> </li> <li> <divclass='title'> <a href="http://www.cnblogs.com/caidupingblogs/gallery/818864.html">bigbang-006</a> </div> "http://images.cnblogs.com/cnblogs_com/caidupingblogs/818864/o_bigbang-004.jpg"> </li> </ul> </div></body>
Run
Accordion pictures of jquery