|
|
Line 4: |
Line 4: |
| | | |
| | | |
| + | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> |
| <html xmlns="http://www.w3.org/1999/xhtml"> | | <html xmlns="http://www.w3.org/1999/xhtml"> |
| <head> | | <head> |
Line 15: |
Line 16: |
| | | |
| </head> | | </head> |
- | <script type="text/javascript" src="https://sites.google.com/site/mariozoner/gb-mario/jquery-1.3.2.js"></script>
| + | |
| + | <script type="text/javascript" src="https://sites.google.com/site/mariozoner/gb-mario/jquery-1.3.2.js"></script> |
| | | |
| <script type="text/javascript"> | | <script type="text/javascript"> |
Line 43: |
Line 45: |
| <style> | | <style> |
| *Navigasi*/ | | *Navigasi*/ |
- | ul#navigation { position:fixed; margin:0px; padding:0px; top:-20px; left:370px; list-style:none; z-index:999999; width:675px; font:normal 16px Electrolize,Sans-Serif bold; -webkit-animation:2s fxhompinav ease-in-out; -moz-animation:2s fxhompinav ease-in-out; -ms-animation:2s fxhompinav ease-in-out; animation:2s fxhompinav ease-in-out; } ul#navigation li { width:95px; display:inline; float:left; margin:0 0 0 2px; } ul#navigation li a { display:block; float:left; margin-top:-74px; width:95px; height:28px; background-color: rgba(0, 0, 0, 0.6); | + | ul#navigation { position:fixed; margin:0px; padding:0px; top:-20px; left:370px; list-style:none; z-index:999999; width:675px; font:normal 16px Electrolize,Sans-Serif bold; -webkit-animation:2s fxhompinav ease-in-out; -moz-animation:2s fxhompinav ease-in-out; -ms-animation:2s fxhompinav ease-in-out; animation:2s fxhompinav ease-in-out; } |
| + | |
| + | ul#navigation li { width:95px; display:inline; float:left; margin:0 0 0 2px; } |
| + | ul#navigation li a { display:block; float:left; margin-top:-74px; width:95px; height:28px; background-color: rgba(0, 0, 0, 0.6); |
| background: rgba(0, 0, 0, 0.6); | | background: rgba(0, 0, 0, 0.6); |
- | color: rgba(0, 0, 0, 0.6); background-repeat:no-repeat; background-position:50% 150px; border:2px solid #b9b9b9; -webkit-box-shadow:0 1px 2px rgba(0, 0, 0, 0.5); -moz-box-shadow:0 1px 2px rgba(0, 0, 0, 0.5); box-shadow:0 1px 2px rgba(0, 0, 0, 0.5); -moz-border-radius:0px 0px 10px 10px; -webkit-border-bottom-right-radius:10px; -webkit-border-bottom-left-radius:10px; -khtml-border-bottom-right-radius:10px; -khtml-border-bottom-left-radius:10px; border-radius:0px 0px 10px 10px; color:#333333; text-decoration:none; text-align:center;color:#f1f1f1; text-shadow:0 1px 1px #000; padding-top:95px; -webkit-transition:margin-top 0.3s ease-in-out,background-position 0.4s ease-out; -moz-transition:margin-top 0.3s ease-in-out,background-position 0.4s ease-out; -o-transition:margin-top 0.3s ease-in-out,background-position 0.4s ease-out; transition:margin-top 0.3s ease-in-out,background-position 0.4s ease-out; } ul#navigation li a:hover { margin-top:-3px; background-position:50% 25px; color:#7b7b7b; position:relative; } ul#navigation li a:hover:after { content:""; width:0px; height:0px; position:absolute; top:100%; left:45%; margin-top:2px; border-width:5px; border-style:solid; border-color:transparent transparent lime transparent; } | + | color: rgba(0, 0, 0, 0.6); background-repeat:no-repeat; background-position:50% 150px; border:2px solid #b9b9b9; -webkit-box-shadow:0 1px 2px rgba(0, 0, 0, 0.5); -moz-box-shadow:0 1px 2px rgba(0, 0, 0, 0.5); box-shadow:0 1px 2px rgba(0, 0, 0, 0.5); -moz-border-radius:0px 0px 10px 10px; -webkit-border-bottom-right-radius:10px; -webkit-border-bottom-left-radius:10px; -khtml-border-bottom-right-radius:10px; -khtml-border-bottom-left-radius:10px; border-radius:0px 0px 10px 10px; color:#333333; text-decoration:none; text-align:center;color:#f1f1f1; text-shadow:0 1px 1px #000; padding-top:95px; -webkit-transition:margin-top 0.3s ease-in-out,background-position 0.4s ease-out; -moz-transition:margin-top 0.3s ease-in-out,background-position 0.4s ease-out; -o-transition:margin-top 0.3s ease-in-out,background-position 0.4s ease-out; transition:margin-top 0.3s ease-in-out,background-position 0.4s ease-out; } |
| + | |
| + | ul#navigation li a:hover { margin-top:-3px; background-position:50% 25px; color:#7b7b7b; position:relative; } |
| + | |
| + | ul#navigation li a:hover:after { content:""; width:0px; height:0px; position:absolute; top:100%; left:45%; margin-top:2px; border-width:5px; border-style:solid; border-color:transparent transparent lime transparent; } |
| + | |
| ul#navigation li:nth-child(1) a {background-image:url(Url Gambar Menu ke 1); } | | ul#navigation li:nth-child(1) a {background-image:url(Url Gambar Menu ke 1); } |
| ul#navigation li:nth-child(2) a { background-image:url(Url Gambar Menu ke 2); } | | ul#navigation li:nth-child(2) a { background-image:url(Url Gambar Menu ke 2); } |
Line 56: |
Line 66: |
| /*Navigasi*/ | | /*Navigasi*/ |
| | | |
- | </style> | + | </style> |
- | | + | |
- | | + | |
- | | + | |
| <script language='javascript' src='https://sites.google.com/site/tutorialseoblogger/file/jquery_mini.js'></script> | | <script language='javascript' src='https://sites.google.com/site/tutorialseoblogger/file/jquery_mini.js'></script> |
| <script language='javascript' src='https://sites.google.com/site/tutorialseoblogger/file/jquery.dimensions.js'></script> | | <script language='javascript' src='https://sites.google.com/site/tutorialseoblogger/file/jquery.dimensions.js'></script> |
| | | |
| <body> | | <body> |
- |
| |
- | <ul id="navigation" style="margin:40px 0 0 270px">
| |
- | <li class="nav1"><a href="http://nthoeng.blogspot.com/">Home</a></li>
| |
- | <li class="nav2"><a href="http://nthoeng.blogspot.com/feeds/posts/default">Rss Feed</a></li>
| |
- | <li class="nav3"><a href="http://nthoeng.blogspot.com/p/blog-teman.html">Blog Teman</a></li>
| |
- | <li class="nav4"><a href="http://nthoeng.blogspot.com/p/site-map_21.html">Site Map</a></li>
| |
- | <li class="nav5"><a href="javascript:showHideGB()">Guestbook</a></li>
| |
- | <li class="nav5"><a href="http://nthoeng.blogspot.com/p/fan-page.html">Fan Page</a></li>
| |
- | <li class="nav1"><a href="http://nthoeng.blogspot.com/">Home</a></li>
| |
- | <li class="nav1"><a href="http://nthoeng.blogspot.com/">Home</a></li>
| |
- |
| |
- | </ul>
| |
- |
| |
- |
| |
| <div id="bg_top"> | | <div id="bg_top"> |
- | <div id='floatMenu'>
| + | <div id="wrap_bg"> |
| + | |
| + | <div id='floatMenu'> |
| <ul class='menu1'> | | <ul class='menu1'> |
| <li><a href='#' title='Link 1'> Link 1 </a></li> | | <li><a href='#' title='Link 1'> Link 1 </a></li> |
Line 101: |
Line 97: |
| </script> | | </script> |
| </div> | | </div> |
- | <div id="wrap_bg">
| + | |
- | <div id="wrap">
| + | <ul id="navigation" style="margin:120px 0 0 220px"> |
- | <div id="header">
| + | <li class="nav1"><a href="http://nthoeng.blogspot.com/">Home</a></li> |
- | <div id="menu">
| + | <li class="nav2"><a href="http://nthoeng.blogspot.com/feeds/posts/default">Rss Feed</a></li> |
- | <ul>
| + | <li class="nav3"><a href="http://nthoeng.blogspot.com/p/blog-teman.html">Blog Teman</a></li> |
- | <li class="but1_menu"><a href="index.html" class="active"></a></li>
| + | <li class="nav4"><a href="http://nthoeng.blogspot.com/p/site-map_21.html">Site Map</a></li> |
- | <li class="but2_menu"><a href="blog.html"></a></li>
| + | <li class="nav5"><a href="javascript:showHideGB()">Guestbook</a></li> |
- | <li class="but3_menu"><a href="gallery.html"></a></li>
| + | <li class="nav5"><a href="http://nthoeng.blogspot.com/p/fan-page.html">Fan Page</a></li> |
- | <li class="but4_menu"><a href="about.html"></a></li>
| + | <li class="nav1"><a href="http://nthoeng.blogspot.com/">Home</a></li> |
- | <li class="but5_menu"><a href="contact.html"></a></li>
| + | <li class="nav1"><a href="http://nthoeng.blogspot.com/">Home</a></li> |
- | </ul>
| + | |
- | </div>
| + | </ul> |
- | <div id="logo">
| + | <img style="margin-left:-900px" src="https://static.igem.org/mediawiki/2012/archive/9/90/20120909091254%21BAU-Indonesia_logo.png" /> |
- | <img src="https://static.igem.org/mediawiki/2012/archive/9/90/20120909091254%21BAU-Indonesia_logo.png" />
| + | <div id="wrap"> |
- | </div>
| + | <div id="header"> |
| + | |
| <div id="prew_box"> | | <div id="prew_box"> |
| <div id="wrapper"> | | <div id="wrapper"> |
Line 143: |
Line 140: |
| </div> <div style="clear: both"></div> | | </div> <div style="clear: both"></div> |
| <div id="content" style="background:url(https://static.igem.org/mediawiki/2012/6/67/A.jpg)"> | | <div id="content" style="background:url(https://static.igem.org/mediawiki/2012/6/67/A.jpg)"> |
- |
| |
| | | |
| + | <!-- |
| + | <div class="verticalaccordion"> |
| + | <ul> |
| + | <li> |
| + | <h3>Daftar isi</h3> |
| + | <div id="isinya">isi konten di sini bisa juga dengan java script atau yang lainnya</div> |
| + | </li> |
| + | <li> |
| + | <h3>F1</h3> |
| + | <div id="isinya">pokonya apa saja isi di sini terserah mau di isi apa</div> |
| + | </li> |
| + | <li> |
| + | <h3>Free Dfloaf</h3> |
| + | <div id="isinya">isi apa saja terserah sobat</div> |
| + | </li> |
| + | <li> |
| + | <h3>Free Dosfs</h3> |
| + | <div id="isinya">isi konten di sini bisa dengan gambar atau yang lainnya</div> |
| + | </li> |
| + | </ul> |
| + | </div> |
| + | --> |
| <div id="left_column"> | | <div id="left_column"> |
| <!-- Start left news box --> | | <!-- Start left news box --> |
Line 274: |
Line 292: |
| | | |
| </div> | | </div> |
- | </div>
| + | </div> |
| </div> | | </div> |
| | | |
- | </div>
| + | </div> |
| </div> | | </div> |
| </div> | | </div> |
| </body> | | </body> |
| </html> | | </html> |