ลำดับตอนที่ #9
คืนค่าการตั้งค่าทั้งหมด
คุณแน่ใจว่าต้องการคืนค่าการตั้งค่าทั้งหมด ?
ลำดับตอนที่ #9 : Behind the curtain...
PREVIEW
<html>
<head>
<title>Behind the curtain...</title>
<script type="text/javascript" src="http://yoursweetestlullaby.webs.com/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="http://yoursweetestlullaby.webs.com/slidedeck.jquery.js"></script>
<style type="text/css">
#slidedeck_frame {
width: 900px;
height: 600px;
margin: 50px auto;
}
.master {
background:#fff;
position: relative;
padding: 0;
}
.master dl.slidedeck {
height: 600px;
position: relative;
width: 100%;
height: 100%;
margin: 0;
}
.master dl.slidedeck > dd {
position: relative;
height: 600px;
padding: 0px;
margin: 0;
background:#fff;
overflow: hidden;
border: 1px dashed #d1d1d1;
}
.master dl.slidedeck > dd img.alignleft{margin:0 10px 10px 0}
.master dl.slidedeck > dd img.alignright{margin:0 0 10px 10px}
.master dl.slidedeck > dd img.aligncenter{margin-bottom:10px}
.master dl.slidedeck > dt {
position: relative;
height: 45px;
line-height: normal;
font-size: 30px;
font-family: 'appleberry', serif;
letter-spacing: 10px;
color: #fff;
margin: 0;
padding: 0;
padding-right: 25px;
text-transform: uppercase;
}
.master dl.slidedeck dt.spine_1 {
background: #EA5A64;
}
.master dl.slidedeck dt.spine_2 {
background: #F3C99F;
}
.master dl.slidedeck dt.spine_3 {
background: #14D69A;
}
.master dl.slidedeck dt.spine_4 {
background: #849BA9;
}
.master dl.slidedeck dt.spine:hover {
color: #ECDAC6;
}
.master dl.slidedeck dt.spine.active,
.master dl.slidedeck dt.spine.active:hover {
color: #fff;
}
.master dl.slidedeck dt.spine .index {
display: none;
font-size: 0px;
}
#navbar-iframe {
display: none;
}
.title {
font-family: 'appleberry', serif;
font-size: 60pt;
text-align: center;
color: #ecdac6;
background: #fff;
display: block;
margin-top: -10px;
}
.title a {
text-decoration: none;
color: #ecdac6;
}
.title a:hover {
color: #ecdac6;
border: none;
font-style: normal;
}
body {
background: url('http://i.imgur.com/igY0D.png') repeat;
color:#545151;
cursor: crosshair;
}
.pic {
padding-top: 30px;
width: 160px;
text-align: center;
height: 600px;
border-right: 1px dashed #d1d1d1;
background: #f1f1f1;
position: absolute;
top: 0px;
left: 45px;
}
.txt {
position: absolute;
top: 0px;
right: 0px;
padding: 25px 30px 30px 30px;
height: 540px;
overflow: auto;
width: 500px;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
line-height: 18px;
}
.etitle {
font-family: 'appleberry', serif;
font-size: 30pt;
color: #565656;
text-transform: capitalize;
margin-bottom: 25px;
margin-top: 10px;
}
.date {
background: #f5f5f5;
font: 10px Arial, serif;
color: #c1c1c1;
letter-spacing: 3px;
padding: 5px;
text-transform: uppercase;
text-align: right;
margin-bottom: 10px;
}
::-webkit-scrollbar {
width: 10px;
background-color: #f1f1f1;
border-right:none;
}
::-webkit-scrollbar-button:start:decrement, ::-webkit-scrollbar-button:end:increment {
height: 1px;
display: block;
background: #f1f1f1;
}
::-webkit-scrollbar-track-piece {
background-color: #f1f1f1;
}
::-webkit-scrollbar-thumb{
background-color: #c1c1c1;
-webkit-border-radius: 400px;
border-radius: 400px;
}
a {
color: #a1a1a1;
text-decoration:none;
cursor: crosshair;
}
a:hover {
color: #545151;
border-bottom: dashed 1px #a1a1a1;
font-style: italic;
}
img:hover {
opacity: 0.6;
filter:alpha(opacity=60);
transition: opacity 1s;
-moz-transition: opacity 1s;
-webkit-transition: opacity 1s;
-o-transition: opacity 1s;
moz-opacity: 0.60;
}
img {
opacity:0.75;
filter:alpha(opacity=75);
transition: opacity 1s;
-moz-transition: opacity 1s;
-webkit-transition: opacity 1s;
-o-transition: opacity 1s;
moz-opacity: 0.75;
}
blockquote {
border-left : 30px solid #848484;
background: url('http://i.imgur.com/igY0D.png') #f1f1f1;
padding: 15px;
}
@font-face {
font-family: 'appleberry';
src: url('http://yoursweetestlullaby.webs.com/appleberry%20with%20accents.ttf');
}
</style>
</head>
<body>
<h1 class="title"><a href="/" onMouseOver="this.innerHTML='Then the rainbow comes!'" onMouseOut="this.innerHTML='The rain falls...'">The rain falls...</a></h1>
<div id="slidedeck_frame" class="master">
<dl class="slidedeck">
<dt>we</dt>
<dd>
<div class="pic">
<img src="http://i.imgur.com/UmtmY.jpg" width="100" />
</div>
<div class="txt">
<blogger>
<div class="etitle"><BlogItemTitle><$BlogItemTitle$></BlogItemTitle></div>
<div class="date">
<BlogDateHeader><$BlogDateHeaderDate$></BlogDateHeader> - <$BlogItemDateTime$>
</div>
<$blogitembody$>
</blogger><br>
<center>。・☆。・☆・。。・☆。・☆・。<br><br>
<center>
<OlderPosts><a href='<$OlderPosts$>'>« Previous</a></OlderPosts> <NewerPosts> | <a href='<$NewerPosts$>'>Next »</a></NewerPosts>
</center>
</div>
</dd>
<dt>brighten</dt>
<dd>
<div class="pic">
<img src="http://i.imgur.com/gO5wi.jpg" width="100" />
</div>
<div class="txt">
<div class="etitle">Under the umbrella...</div>
Little monster. Breath since dd/mm/yyyy. Beautiful nerd. Likes. Dislikes. Anything about you, drop it all! ;)
</div>
</dd>
<dt>your</dt>
<dd>
<div class="pic">
<img src="http://i.imgur.com/lgFRe.jpg" width="100" />
</div>
<div class="txt">
<div class="etitle">Taste the rain :)</div>
your affiliates and archive goes here!<br />
<a href="http://">link1</a> | <a href="http://">link2</a> | <a href="http://">link3</a> | <a href="http://">link4</a> | <a href="http://">link5</a>
<br /><br />
<BloggerArchives><a href="<$BlogArchiveURL$>"><$BlogArchiveName$></a> </BloggerArchives>
<br /><br />
<div class="etitle">rainbow fairy</div>
Behind the curtain... // 2012<br />
© <a href="http://flavors.me/shakkun/">your</a> <a href="http://blogskins.com/me/dancing_girl1/">sweetest</a> <a href="http://yoursweetestlullaby.blogspot.com/">lullaby</a><br />
Ressources : <a href="http://slidedeck.com/">x</a> <a href="http://colourlovers.com/">x</a> <a href="http://favim.com/">x</a> <a href="http://brittneymurphydesign.com/">x</a>
</div>
</dd>
<dt>day</dt>
<dd>
<div class="pic">
<img src="http://i.imgur.com/vH9UW.jpg" width="100" />
</div>
<div class="txt">
<div class="etitle">Laugh as hard as you can!</div>
put your <s>scream</s> chat box here :)<br />
max width 500px, kay?
</div>
</dd>
</dl>
</div>
<script type="text/javascript">
/* Initiate the SlideDeck */
$('.master dl.slidedeck').slidedeck({
autoPlay: false,
cycle: false,
autoPlayInterval: 2500, // 2.5 seconds
});
</script>
</body>
</html>
<style type="text/css">.external, #module_right, .modulebg1, .left, .headtable, #header, #footer, #head_module_desc, #module_right .modulebg2, #module_left .modulebg2,#neck, .hr2, #head_module_name, .head2, .hr1 { display: none!important;}
.right {background: none; border: 0px!important; border: none!Important; position: absolute; top: 0px; left: 0px;} .modulebg2 {background: none;} .mainborder {border:none!important;} </style>
เก็บเข้าคอลเล็กชัน
ความคิดเห็น