iDDM., Blogskins to iDDream

ลำดับตอนที่ #18 : ● Skin #360688 [X: Aquarius.]

Preview

 

ดูแบบเว็บที่ Blogskins.com

Codes.

สามารถก็อปไปแปะได้เลย (กดแทรกโค้ดก่อนนะครับ)

<script>$(".toggle_container").hide(); jQuery.fn.fadeToggle = function(speed, easing, callback) { return $(this).animate({opacity: 'toggle'}, speed, easing, callback); }; $("h2.trigger").click(function(){ $(this).toggleClass("active").next().slideToggle("normal"); }); </script><style type="text/css"> body { text-align: center; background-color: #D2CFC2; cursor: crosshair; scrollbar-face-color: #E3E1D9; scrollbar-highlight-color: #E3E1D9; scrollbar-3dlight-color: #D2CFC2; scrollbar-shadow-color: #E3E1D9; scrollbar-darkshadow-color: #D2CFC2; scrollbar-arrow-color: #FCFCFA; scrollbar-track-color: #D2CFC2; } A:link {text-decoration: none; color: #75A494; font-size: 10px; font-family: georgia; cursor: crosshair; line-height: 120%; } A:active, A:visited {text-decoration: none; color: #75A494; font-size: 10px; font-family: georgia; cursor: crosshair; line-height: 120%;} A:hover {border: none; color: #9C8F89; font-size: 10px; font-family: georgia; cursor: crosshair; background: #D2CFC2;} u {text-decoration: none; border-bottom: 1px #E3E3E3 dashed;} b {color: #6F6157;} i {font-family: georgia;} blockquote {border: 1px solid #EDEDED; background: #FBFBFB; color: #9E9E9E; padding: 10px;} #navbar-iframe{margin: -30px 0px 0px 0px; display: none;} ::-moz-selection{color: #FCFCFA; background: #D2CFC2;} .eclaicon { background: #ECEADF; padding: 5px;opacity:0.9;} table { font-family: arial; color: #75817C;} #vanilla { top: 0px;} #lollipop { text-align: justify; vertical-align: top; background: transparent; width: 632px;} #sky { background-color: transparent; text-align: justify; vertical-align: top; width: 195px; padding-top: 294px;} .gee { font: bold 6.5pt arial; color: #A8AFB2; padding: 2px 2px 2px 3px; line-height: 100%; letter-spacing:3px; text-transform:uppercase; background-color: #ECEADF; text-shadow:#CFD3D5 1px 1px 5px; } .gee2 { font: normal 28px arial; color: #EAEAEA; letter-spacing: -2px; line-height: 80%; text-transform: lowercase; text-shadow:#A3A092 1px 1px 8px;} .genie { font: normal 30px arial; color: #E8EBE7; letter-spacing: -2.5px; line-height: 90%; text-shadow:#899287 1px 1px 1px; text-transform: lowercase; text-align: center; padding: 2px 6px 0px 6px; border-bottom-height:15px;} .big { background: transparent;} .big2 { background: #F6F6F6;} .bang { font-size: 8pt; color: #6B6A5C; text-align: justify; padding: 5px;} .bang2 { font-size: 8pt; background: #FCFCFA; text-align: justify;} .tiara { border-top: 1px solid #E1E1E1;} .headerimage { position: relative; width: 515px; height: 289px; margin-left: 117px; margin-right: auto; margin-bottom: 0px; background-image: url('http://i373.photobucket.com/albums/oo179/eclair-x_blogskins/underwater_eclair-x.jpg'); background-repeat: no-repeat; background-position: center; } h2.trigger { margin: 0 0 0px 0; padding: 0px; width: 195px; font-size: 2em; font-weight: normal; float: left; } h2.trigger a { color: #fff; text-decoration: none; display: block; } h2.trigger a:hover {text-decoration: none;} h2.active {color: #fff;text-decoration: none;} .toggle_container { padding-top: 5px; background-image: url('http://i373.photobucket.com/albums/oo179/eclair-x_blogskins/fadefish.png'); background-repeat: repeat-x; overflow: hidden; clear: both; margin-bottom: 3px; } .toggle_container .block { text-decoration: none; } .dates { background-color: #ECEADF; font: normal 7pt arial; font-color: #929B9F; letter-spacing: 1px; text-transform: uppercase; text-align: justify; width: 503px; margin-left: 117px; padding: 5px 6px 5px 6px; margin-bottom: 0px; }</style> <div align="center" id="vanilla"> <table cellspacing="0" cellpadding="0" border="0"> <tbody> <tr> <td id="lollipop"> <div class="headerimage"></div> <table cellspacing="0" cellpadding="0" border="0"> <tbody> <tr> <td width="112" valign="top"> <div style="padding-top: 14px"> <div align="center" class="eclaicon"><img src="http://i373.photobucket.com/albums/oo179/eclair-x_blogskins/aquariusicon_eclairx-1.png" alt="" /></div> </div> <p></p> </td> <td width="5"></td> <td width="515" valign="top"> <div class="gee"><$BlogDateHeaderDate$>,</div> <div class="big2"> <div class="bang2"> <div class="genie"><$BlogItemTitle$></div> <div style="border-bottom: #ebeae5 1px solid; margin: 0px 150px; padding-top: 4px"></div> <div style="padding-left: 5px; padding-right: 5px; border-top: transparent 10px solid" id="postbody"><$BlogItemBody$></div> <br /> <div style="margin: 0px 150px; border-top: #ebeae5 1px solid; padding-top: 4px"></div> <div style="text-align: center; padding-bottom: 8px"><a href="">Comment box here, if any.</a></div> </div> </div> </td> </tr> </tbody> </table> <div class="dates"><a href="link">← previous</a> <div style="float: right"><a href="link">later →</a></div> </div> </td> <td width="3"></td> <td id="sky"> <h2 class="trigger"><a href="#"> <div class="gee2">Profile</div> </a></h2> <div class="toggle_container"> <div class="block"> <div class="big"> <div class="bang">Hello, my name is paper and I am a piece of paper. My purpose is to have people write on me and to be printed by printers. I like the smell of wood because it smells like my parents. My ambition is to be thrown away and recycled.</div> </div> </div> </div> <div></div> <div></div> <h2 class="trigger"><a href="#"> <div class="gee2">Tagboard</div> </a></h2> <div class="toggle_container"> <div class="block">Your tagboard here.</div> </div> <p></p> <h2 class="trigger"><a href="#"> <div class="gee2">Affiliates</div> </a></h2> <div class="toggle_container"> <div class="block"> <div class="big"> <div class="bang">Your links go here.</div> </div> </div> </div> <h2 class="trigger"><a href="#"> <div class="gee2">Archives</div> </a></h2> <div class="toggle_container"> <div class="block"> <div class="big"> <div class="bang"><center> <form name="jump" id="jump"> <select name="menu" style="font-family: arial; background: #f6f6f6; color: #75817c; font-size: 8pt" onchange="location=document.jump.menu.options [document.jump.menu.selectedIndex].value;" value="GO"> <option selected="selected">I know you stalk me.</option> <option value="<$BlogArchiveLink$>"><$BlogArchiveName$></option> </select> </form> </center></div> </div> </div> </div> <h2 class="trigger"><a href="#"> <div class="gee2">Credits</div> </a></h2> <div class="toggle_container"> <div class="block"> <div class="big"> <div class="bang">Blogskin and icon created by <a href="http://www.eclair-x.blogspot.com/" target="_blank">Ecla</a><a href="http://blogskins.com/me/eclair-x" target="_blank">ir-x</a>. Original art by <a href="http://ke100s.net/index.html">Kazuaki</a>. <p>Best viewed in 1440 x 810 pixels screen resolution, Mozilla Firefox.</p> </div> </div> </div> </div> </td> </tr> </tbody> </table> </div> <!-- iD Clean Code Ver. 2.5 By Fantasier --><!-- อย่าลบข้อความเครดิตที่มานะครับ สามารถก็อปต่อไปได้โดยไม่ลบเครดิตในโค้ด ไม่ต้องให้เครดิตที่หน้าไอดีก็ได้จ้า --> <div class="theanchor"></div> <script type="text/javascript">$('#wrapper').hide();$(function(){ $('#wrapper').parent().html($('.theanchor').parent().contents());});</script>

หมายเหตุ: มีปัญหาแสดงผลใน IE6 สำหรับ IE7+, Firefox, Chrome เทสแล้วไม่มีปัญหา