陳沛鴻 Home1 templatemo 378 dragonfly index7

From 2014hs.igem.org

(Difference between revisions)
Line 1: Line 1:
{{:陳沛鴻_Styling_tricks}}
{{:陳沛鴻_Styling_tricks}}
-
<html>
+
                          [[]]
-
<!--[if lt IE 7]>      <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
+
* [[Home]]
-
<!--[if IE 7]>        <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
+
* [[About]]
-
<!--[if IE 8]>        <html class="no-js lt-ie9"> <![endif]-->
+
* [[Services]]
-
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
+
* [[Portfolio]]
-
<head>
+
* [[Contact]]
-
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+
  [[Image:facebook.png|Facebook]] [[Image:flickr.png|Flickr]] [[Image:twitter.png|Twitter]] 
-
<title>Dragonfly, free website template</title>
+
c 2072 Company Name<br> [[Dragonfly]] by<br> [[templatemo]]
-
<meta name="keywords" content="dragonfly, free website templates, one page layout, jquery" />
+
-
<meta name="description" content="Dragonfly is one-page layout using jQuery and it is free website template from templatemo.com" />
+
-
<link href="https://2014hs.igem.org/%E9%99%B3%E6%B2%9B%E9%B4%BB_Reset_CSS?action=raw&ctype=text/css" type="text/css" rel="stylesheet" />
+
      [[Image:%E9%99%B3%E6%B2%9B%E9%B4%BB_Home1_templatemo_378_dragonfly_images_slider_01.jpg|Dragonfly 1]] [[Image:%E9%99%B3%E6%B2%9B%E9%B4%BB_Home1_templatemo_378_dragonfly_images_slider_02.jpg|Dragonfly 2]] [[Image:%E9%99%B3%E6%B2%9B%E9%B4%BB_Home1_templatemo_378_dragonfly_images_slider_03.jpg|Dragonfly 3]] [[Image:%E9%99%B3%E6%B2%9B%E9%B4%BB_Home1_templatemo_378_dragonfly_images_slider_04.jpg|Dragonfly 4]] [[Image:%E9%99%B3%E6%B2%9B%E9%B4%BB_Home1_templatemo_378_dragonfly_images_slider_05.jpg|Dragonfly 5]]       
 +
= About =
 +
  [[Image:templatemo_image_01.jpg|image 1]] 
 +
''Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius, ut fermentum sem adipiscing id.''
-
<link href="https://2014hs.igem.org/%E9%99%B3%E6%B2%9B%E9%B4%BB_Home1_templatemo_378_dragonfly_templatemo_style1?action=raw&ctype=text/css" type="text/css" rel="stylesheet" />
 
-
<script type="text/javascript" src="https://2014hs.igem.org/%E9%99%B3%E6%B2%9B%E9%B4%BB_Home1_templatemo_378_dragonfly_jquery.min?action=raw&ctype=text/javascript"></script>
 
-
<script type="text/javascript" src="https://2014hs.igem.org/%E9%99%B3%E6%B2%9B%E9%B4%BB_Home1_templatemo_378_dragonfly_jquery.scrollTo-min?action=raw&ctype=text/javascript"></script>
 
-
<script type="text/javascript" src="https://2014hs.igem.org/%E9%99%B3%E6%B2%9B%E9%B4%BB_Home1_templatemo_378_dragonfly_jquery.localscroll-min?action=raw&ctype=text/javascript"></script>
 
-
<script type="text/javascript" src="https://2014hs.igem.org/%E9%99%B3%E6%B2%9B%E9%B4%BB_Home1_templatemo_378_dragonfly_init?action=raw&ctype=text/javascript"></script>
 
-
   
 
-
    <link rel="stylesheet" href="https://2014hs.igem.org/%E9%99%B3%E6%B2%9B%E9%B4%BB_Home1_templatemo_378_dragonfly_slimbox2_css?action=raw&ctype=text/css" type="text/css" media="screen" />
 
-
 
-
<script type="text/JavaScript" src="https://2014hs.igem.org/%E9%99%B3%E6%B2%9B%E9%B4%BB_Home1_templatemo_378_dragonfly_slimbox2_js?action=raw&ctype=text/javascript"></script>
 
   
   
 +
Sed vitae aliquam arcu. Donec urna massa, cursus et mattis at, mattis quis lectus. Cras in erat purus. Aliquam odio nibh, suscipit quis venenatis vitae, fringilla at quam. Proin turpis nibh, vestibulum non dignissim a, blandit at nulla mattis sapien.
 +
  [[Image:templatemo_image_02.jpg|image 2]] 
 +
''Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius, ut fermentum sem adipiscing id.''
 +
 +
Sed vitae aliquam arcu. Donec urna massa, cursus et mattis at, mattis quis lectus. Cras in erat purus. Aliquam odio nibh, suscipit quis venenatis vitae, fringilla at quam. Proin turpis nibh, vestibulum non dignissim a, blandit at nulla mattis sapien. Validate [[XHTML]] &amp; [[CSS]].
 +
 
 +
= Services =
 +
  [[Image:templatemo_image_04.jpg|image 4]] 
 +
* Maecenas ac odio ipsum donec
 +
* Fusce risus tortor, interdum
 +
* Proin facilisis ullamcorper
 +
* Sed vel justo quis ligula
 +
* Ut tristique sagittis arcu
 +
* Maecenas ac odio ipsum donec
 +
* Fusce risus tortor, interdum
 +
* Proin facilisis ullamcorper
 +
    [[Image:templatemo_image_03.jpg|image 3]] 
 +
''Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nam mauris ipsum, pulvinar sit amet varius at, placerat ut felis. ''
-
<link rel="stylesheet" href="https://2014hs.igem.org/%E9%99%B3%E6%B2%9B%E9%B4%BB_Home1_templatemo_378_dragonfly_orman?action=raw&ctype=text/css" type="text/css" media="screen" />
+
-
<link rel="stylesheet" href="https://2014hs.igem.org/%E9%99%B3%E6%B2%9B%E9%B4%BB_Home1_templatemo_378_dragonfly_nivo-slider?action=raw&ctype=text/css" type="text/css" media="screen" />
+
Donec vitae tortor non ipsum tristique condimentum ac ac nulla. Etiam sagittis iaculis dolor ut euismod. Nam faucibus, risus at consequat malesuada, urna turpis sagittis libero, sodales hendrerit dui arcu et nisi. Praesent pulvinar, dolor id lacinia pulvinar, mi ligula tempor libero, et semper sem dolor et elit.
-
 
-
</head>
 
-
<body>
 
-
<div id="templatemo_wrapper">
 
-
<div id="templatemo_header">
 
-
    <div id="site_title"><a href="http://www.templatemo.com/preview/templatemo_378_dragonfly" rel="nofollow" target="_parent"></a></div>
 
-
    <ul class="nav_menu">
 
-
        <li><a href="#home">Home</a></li>
 
-
        <li><a href="#about">About</a></li>
 
-
        <li><a href="#services">Services</a></li>
 
-
        <li><a href="#gallery">Portfolio</a></li>
 
-
        <li><a href="#contact">Contact</a></li>
 
-
    </ul>
 
-
    <div class="social_button">
 
-
    <a href="#"><img src="images/facebook.png" alt="Facebook" /></a>
 
-
<a href="#"><img src="images/flickr.png" alt="Flickr" /></a>
 
-
<a href="#"><img src="images/twitter.png" alt="Twitter" /></a>
 
-
        <div class="clear"></div>
 
-
    </div>
 
-
    <p>
 
-
    c 2072 Company Name<br />
 
-
    <a href="http://www.templatemo.com/preview/templatemo_378_dragonfly" rel="nofollow" target="_parent">Dragonfly</a> by<br />
 
-
    <a href="http://www.templatemo.com" rel="nofollow" target="_parent">templatemo</a></p>
 
      
      
-
</div>
+
* [[Image:09.jpg|image 9]]
-
<div id="templatemo_main">
+
* [[Image:10.jpg|image 10]]
-
 
+
* [[Image:11.jpg|image 11]]
-
      <div id="home" class="home_slider">
+
* [[Image:12.jpg|image 12]]
-
            <div class="theme-orman">
+
* [[Image:01.jpg|image 01]]
-
                <div id="slider" class="nivoSlider">
+
* [[Image:02.jpg|image 02]]
-
                    <img src="https://static.igem.org/mediawiki/2014hs/8/82/%E9%99%B3%E6%B2%9B%E9%B4%BB_Home1_templatemo_378_dragonfly_images_slider_01.jpg" alt="Dragonfly 1" rel="https://static.igem.org/mediawiki/2014hs/7/7e/%E9%99%B3%E6%B2%9B%E9%B4%BB_Home1_templatemo_378_dragonfly_images_slider_01_thumb.jpg" />
+
* [[Image:03.jpg|image 03]]
-
                    <img src="https://static.igem.org/mediawiki/2014hs/b/b6/%E9%99%B3%E6%B2%9B%E9%B4%BB_Home1_templatemo_378_dragonfly_images_slider_02.jpg" alt="Dragonfly 2" rel="https://static.igem.org/mediawiki/2014hs/7/71/%E9%99%B3%E6%B2%9B%E9%B4%BB_Home1_templatemo_378_dragonfly_images_slider_02_thumb.jpg" />
+
* [[Image:04.jpg|image 04]]
-
                    <img src="https://static.igem.org/mediawiki/2014hs/1/13/%E9%99%B3%E6%B2%9B%E9%B4%BB_Home1_templatemo_378_dragonfly_images_slider_03.jpg" alt="Dragonfly 3" rel="https://static.igem.org/mediawiki/2014hs/4/41/%E9%99%B3%E6%B2%9B%E9%B4%BB_Home1_templatemo_378_dragonfly_images_slider_03_thumb.jpg" />
+
* [[Image:05.jpg|image 05]]
-
                    <img src="https://static.igem.org/mediawiki/2014hs/2/22/%E9%99%B3%E6%B2%9B%E9%B4%BB_Home1_templatemo_378_dragonfly_images_slider_04.jpg" alt="Dragonfly 4" rel="https://static.igem.org/mediawiki/2014hs/7/7d/%E9%99%B3%E6%B2%9B%E9%B4%BB_Home1_templatemo_378_dragonfly_images_slider_04_thumb.jpg" />
+
* [[Image:06.jpg|image 06]]
-
                    <img src="https://static.igem.org/mediawiki/2014hs/f/fb/%E9%99%B3%E6%B2%9B%E9%B4%BB_Home1_templatemo_378_dragonfly_images_slider_05.jpg" alt="Dragonfly 5" rel="https://static.igem.org/mediawiki/2014hs/d/d9/%E9%99%B3%E6%B2%9B%E9%B4%BB_Home1_templatemo_378_dragonfly_images_slider_05_thumb.jpg" />
+
* [[Image:07.jpg|image 07]]
-
                </div>
+
* [[Image:08.jpg|image 08]]
-
            </div>
+
* [[Image:09.jpg|image 09]]
-
            <script type="text/javascript" src="https://2014hs.igem.org/%E9%99%B3%E6%B2%9B%E9%B4%BB_Home1_templatemo_378_dragonfly_jquery-1.6.1.min?action=raw&ctype=text/javascript"></script>
+
* [[Image:10.jpg|image 10]]
-
            <script type="text/javascript" src="https://2014hs.igem.org/%E9%99%B3%E6%B2%9B%E9%B4%BB_Home1_templatemo_378_dragonfly_jquery.nivo.slider.pack?action=raw&ctype=text/javascript"></script>
+
* [[Image:11.jpg|image 11]]
-
            <script type="text/javascript">
+
* [[Image:12.jpg|image 12]]
-
            $(window).load(function() {
+
* [[Image:01.jpg|image 01]]
-
                $('#slider').nivoSlider({
+
* [[Image:02.jpg|image 02]]
-
                    controlNavThumbs:true,
+
* [[Image:03.jpg|image 03]]
-
controlNavThumbsFromRel:true,
+
* [[Image:04.jpg|image 04]]
-
directionNav:false, // Next and Prev
+
 
-
keyboardNav:true, // Use left and right arrows
+
= Contact Us =
-
pauseOnHover:true // Stop animation while hovering
+
 
-
                });
+
==== Quick Contact ====
-
            });
+
  Name:  Email: Message:      
-
            </script>
+
==== Address ====
-
      </div>
+
-
        <div class="section section_with_padding" id="about">
+
-
            <h1>About</h1>
+
-
            <div class="img_border img_fl">
+
-
            <a href="http://www.templatemo.com" rel="nofollow"><img src="images/templatemo_image_01.jpg" alt="image 1" /></a>
+
-
          </div>
+
-
            <p><em>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius, ut fermentum sem adipiscing id.</em></p>
+
-
            <p>Sed vitae aliquam arcu. Donec urna massa, cursus et mattis at, mattis quis lectus. Cras in erat purus. Aliquam odio nibh, suscipit quis venenatis vitae, fringilla at quam. Proin turpis nibh, vestibulum non dignissim a, blandit at nulla mattis sapien. </p>    
+
-
            <div class="clear h40"></div>
+
-
            <div class="img_border img_fr">
+
-
                <img src="images/templatemo_image_02.jpg" alt="image 2" />
+
-
            </div>
+
-
            <p><em>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius, ut fermentum sem adipiscing id.</em></p>
+
-
            <p>Sed vitae aliquam arcu. Donec urna massa, cursus et mattis at, mattis quis lectus. Cras in erat purus. Aliquam odio nibh, suscipit quis venenatis vitae, fringilla at quam. Proin turpis nibh, vestibulum non dignissim a, blandit at nulla mattis sapien. Validate <a href="http://validator.w3.org/check?uri=referer" rel="nofollow">XHTML</a> &amp; <a href="http://jigsaw.w3.org/css-validator/check/referer" rel="nofollow">CSS</a>.</p>
+
-
        </div>
+
-
        <div class="section section_with_padding" id="services">
+
-
            <h1>Services</h1>
+
-
            <div class="half right">
+
-
            <div class="img_border img_nom">
+
-
                <a href="http://www.templatemo.com" rel="nofollow"><img src="images/templatemo_image_04.jpg" alt="image 4" /></a>
+
-
                </div>
+
-
            <ul class="list_bullet">
+
-
                    <li>Maecenas ac odio ipsum donec</li>
+
-
                    <li>Fusce risus tortor, interdum</li>
+
-
                    <li>Proin facilisis ullamcorper</li>
+
-
                    <li>Sed vel justo quis ligula</li>
+
-
                    <li>Ut tristique sagittis arcu</li>
+
-
                    <li>Maecenas ac odio ipsum donec</li>
+
-
                    <li>Fusce risus tortor, interdum</li>
+
-
                    <li>Proin facilisis ullamcorper</li>
+
-
                </ul>
+
-
               
+
-
            </div>
+
-
            <div class="half left">
+
-
                <div class="img_border img_nom">
+
-
                <img src="images/templatemo_image_03.jpg" alt="image 3" />
+
-
                </div>
+
-
            <p><em>Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nam mauris ipsum, pulvinar sit amet varius at, placerat ut felis. </em></p>
+
-
            <p>Donec vitae tortor non ipsum tristique condimentum ac ac nulla. Etiam sagittis iaculis dolor ut euismod. Nam faucibus, risus at consequat malesuada, urna turpis sagittis libero, sodales hendrerit dui arcu et nisi. Praesent pulvinar, dolor id lacinia pulvinar, mi ligula tempor libero, et semper sem dolor et elit.</p>
+
-
            </div>
+
-
        </div>
+
-
        <div class="section" id="gallery">
+
-
            <ul id="gallery_wrapper">
+
-
            <li><a href="images/gallery/09-l.jpg" rel="lightbox[gallery]"><img src="images/gallery/09.jpg" alt="image 9" /></a></li>
+
-
                <li><a href="images/gallery/10-l.jpg" rel="lightbox[gallery]"><img src="images/gallery/10.jpg" alt="image 10" /></a></li>
+
-
                <li><a href="images/gallery/11-l.jpg" rel="lightbox[gallery]"><img src="images/gallery/11.jpg" alt="image 11" /></a></li>
+
-
                <li><a href="images/gallery/12-l.jpg" rel="lightbox[gallery]"><img src="images/gallery/12.jpg" alt="image 12" /></a></li>
+
-
                <li><a href="images/gallery/01-l.jpg" rel="lightbox[gallery]"><img src="images/gallery/01.jpg" alt="image 01" /></a></li>
+
-
                <li><a href="images/gallery/02-l.jpg" rel="lightbox[gallery]"><img src="images/gallery/02.jpg" alt="image 02" /></a></li>
+
-
                <li><a href="images/gallery/03-l.jpg" rel="lightbox[gallery]"><img src="images/gallery/03.jpg" alt="image 03" /></a></li>
+
-
                <li><a href="images/gallery/04-l.jpg" rel="lightbox[gallery]"><img src="images/gallery/04.jpg" alt="image 04" /></a></li>
+
-
                <li><a href="images/gallery/05-l.jpg" rel="lightbox[gallery]"><img src="images/gallery/05.jpg" alt="image 05" /></a></li>
+
-
                <li><a href="images/gallery/06-l.jpg" rel="lightbox[gallery]"><img src="images/gallery/06.jpg" alt="image 06" /></a></li>
+
-
                <li><a href="images/gallery/07-l.jpg" rel="lightbox[gallery]"><img src="images/gallery/07.jpg" alt="image 07" /></a></li>
+
-
                <li><a href="images/gallery/08-l.jpg" rel="lightbox[gallery]"><img src="images/gallery/08.jpg" alt="image 08" /></a></li>               
+
-
                <li><a href="images/gallery/09-l.jpg" rel="lightbox[gallery]"><img src="images/gallery/09.jpg" alt="image 09" /></a></li>
+
-
                <li><a href="images/gallery/10-l.jpg" rel="lightbox[gallery]"><img src="images/gallery/10.jpg" alt="image 10" /></a></li>
+
-
                <li><a href="images/gallery/11-l.jpg" rel="lightbox[gallery]"><img src="images/gallery/11.jpg" alt="image 11" /></a></li>
+
-
                <li><a href="images/gallery/12-l.jpg" rel="lightbox[gallery]"><img src="images/gallery/12.jpg" alt="image 12" /></a></li>
+
-
                <li><a href="images/gallery/01-l.jpg" rel="lightbox[gallery]"><img src="images/gallery/01.jpg" alt="image 01" /></a></li>
+
-
                <li><a href="images/gallery/02-l.jpg" rel="lightbox[gallery]"><img src="images/gallery/02.jpg" alt="image 02" /></a></li>
+
-
                <li><a href="images/gallery/03-l.jpg" rel="lightbox[gallery]"><img src="images/gallery/03.jpg" alt="image 03" /></a></li>
+
-
                <li><a href="images/gallery/04-l.jpg" rel="lightbox[gallery]"><img src="images/gallery/04.jpg" alt="image 04" /></a></li>
+
-
            </ul>
+
-
        </div>
+
-
       
+
-
        <div class="section section_with_padding" id="contact">
+
-
            <h1>Contact Us</h1>
+
-
            <div class="half left">
+
-
                <h4>Quick Contact</h4>
+
-
                <div id="contact_form">
+
-
                    <form method="post" name="contact" action="#contact">
+
-
                        <label for="author">Name:</label>
+
-
                        <input name="author" type="text" class="required input_field" id="author" maxlength="30" />
+
-
                        <label for="email">Email:</label>
+
-
                        <input name="email" type="text" class="validate-email required input_field" id="email" maxlength="30" />
+
-
                  <label for="message">Message:</label>
+
-
                        <textarea id="message" name="text" rows="0" cols="0" class="required"></textarea>
+
-
                        <input type="submit" class="submit_btn left" name="submit" id="submit" value="Send" />
+
-
                        <input type="reset" class="submit_btn right" name="Reset" id="reset" value="Reset" />
+
-
                    </form>
+
-
                </div>
+
-
            </div>
+
-
           
+
-
            <div class="half right">
+
-
                <h4>Address</h4>
+
-
                130-310 Duis lacinia dictum, <br />
+
-
                Vestibulum auctor, 10990<br />
+
-
            Nam rhoncus, diam a mollis<br />
+
-
               
+
-
                <div class="clear h20"></div>
+
-
                <div class="img_nom img_border"><a href="http://goo.gl/VZrm0H" target="_blank"><img src="images/location.jpg" alt="our location" width="230" height="230" /></a></div>
+
-
            </div>
+
-
        </div>
+
-
    </div>
+
-
</div>
+
-
 
+
-
</div>
+
-
</body>  
+
                130-310 Duis lacinia dictum, <br>
-
</html>
+
                Vestibulum auctor, 10990<br>
 +
            Nam rhoncus, diam a mollis<br>  [[Image:location.jpg|our location]]

Revision as of 04:51, 6 May 2014

                         [[]] 

 Facebook Flickr Twitter

c 2072 Company Name
Dragonfly by
templatemo 

     Dragonfly 1 Dragonfly 2 Dragonfly 3 Dragonfly 4 Dragonfly 5

Contents

About 

 image 1

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius, ut fermentum sem adipiscing id.


Sed vitae aliquam arcu. Donec urna massa, cursus et mattis at, mattis quis lectus. Cras in erat purus. Aliquam odio nibh, suscipit quis venenatis vitae, fringilla at quam. Proin turpis nibh, vestibulum non dignissim a, blandit at nulla mattis sapien. 

  image 2

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer varius, ut fermentum sem adipiscing id.


Sed vitae aliquam arcu. Donec urna massa, cursus et mattis at, mattis quis lectus. Cras in erat purus. Aliquam odio nibh, suscipit quis venenatis vitae, fringilla at quam. Proin turpis nibh, vestibulum non dignissim a, blandit at nulla mattis sapien. Validate XHTML & CSS.


Services 

  image 4
  • Maecenas ac odio ipsum donec
  • Fusce risus tortor, interdum
  • Proin facilisis ullamcorper
  • Sed vel justo quis ligula
  • Ut tristique sagittis arcu
  • Maecenas ac odio ipsum donec
  • Fusce risus tortor, interdum
  • Proin facilisis ullamcorper 
   image 3

Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nam mauris ipsum, pulvinar sit amet varius at, placerat ut felis.


Donec vitae tortor non ipsum tristique condimentum ac ac nulla. Etiam sagittis iaculis dolor ut euismod. Nam faucibus, risus at consequat malesuada, urna turpis sagittis libero, sodales hendrerit dui arcu et nisi. Praesent pulvinar, dolor id lacinia pulvinar, mi ligula tempor libero, et semper sem dolor et elit.


Contact Us

Quick Contact 

  Name:  Email:  Message:

Address 

               130-310 Duis lacinia dictum, 

               Vestibulum auctor, 10990

           Nam rhoncus, diam a mollis
  our location
Retrieved from "http://2014hs.igem.org/%E9%99%B3%E6%B2%9B%E9%B4%BB_Home1_templatemo_378_dragonfly_index7"