|
|
Line 1: |
Line 1: |
− | <!DOCTYPE html>
| |
− | <html lang="en">
| |
| | | |
− | <head>
| |
− |
| |
− | <meta charset="utf-8">
| |
− | <meta http-equiv="X-UA-Compatible" content="IE=edge">
| |
− | <meta name="viewport" content="width=device-width, initial-scale=1">
| |
− | <meta name="description" content="">
| |
− | <meta name="author" content="">
| |
− |
| |
− | <title>Titre de la page</title>
| |
− |
| |
− | <!-- Bootstrap Core CSS - Uses Bootswatch Flatly Theme: http://bootswatch.com/flatly/ -->
| |
− | <link href="https://maxcdn.bootstrapcdn.com/bootswatch/3.3.5/flatly/bootstrap.min.css" rel="stylesheet" >
| |
− |
| |
− | <!-- Custom CSS -->
| |
− | <link href="http://ironsummitmedia.github.io/startbootstrap-freelancer/css/freelancer.css" rel="stylesheet">
| |
− |
| |
− | <!-- Custom Fonts -->
| |
− | <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha256-k2/8zcNbxVIh5mnQ52A0r3a6jAgMGxFJFE2707UxGCk= sha512-ZV9KawG2Legkwp3nAlxLIVFudTauWuBpC10uEafMHYL0Sarrz5A7G79kXh5+5+woxQ5HM559XX2UZjMJ36Wplg==" crossorigin="anonymous">
| |
− | <link href="http://fonts.googleapis.com/css?family=Montserrat:400,700" rel="stylesheet" type="text/css">
| |
− | <link href="http://fonts.googleapis.com/css?family=Lato:400,700,400italic,700italic" rel="stylesheet" type="text/css">
| |
− |
| |
− | <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
| |
− | <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
| |
− | <!--[if lt IE 9]>
| |
− | <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
| |
− | <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
| |
− | <![endif]-->
| |
− |
| |
− | <!-- wow CSS -->
| |
− | <link rel="stylesheet" type="text/css" href="http://mynameismatthieu.com/WOW/css/libs/animate.css">
| |
− |
| |
− | </head>
| |
− |
| |
− | <body id="page-top" class="index">
| |
− |
| |
− | <!-- Navigation -->
| |
− | <nav class="navbar navbar-default navbar-fixed-top">
| |
− | <div class="container">
| |
− | <!-- Brand and toggle get grouped for better mobile display -->
| |
− | <div class="navbar-header page-scroll">
| |
− | <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
| |
− | <span class="sr-only">Toggle navigation</span>
| |
− | <span class="icon-bar"></span>
| |
− | <span class="icon-bar"></span>
| |
− | <span class="icon-bar"></span>
| |
− | </button>
| |
− | <a class="navbar-brand" href="#page-top">IGEM</a>
| |
− | </div>
| |
− |
| |
− | <!-- Collect the nav links, forms, and other content for toggling -->
| |
− | <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
| |
− | <ul id="pagesMenu" class="nav navbar-nav navbar-right">
| |
− | <li class="hidden">
| |
− | <a href="#page-top"></a>
| |
− | </li>
| |
− | <li class="page-scroll">
| |
− | <a href="#pageHome" data-id="pageHome">Home</a>
| |
− | </li>
| |
− | <li class="page-scroll">
| |
− | <a href="#pageAbout" data-id="pageAbout">Projet</a>
| |
− | </li>
| |
− | <li class="page-scroll">
| |
− | <a href="#pageFoo" data-id="pageFoo">Exemple</a>
| |
− | </li>
| |
− | </ul>
| |
− | </div>
| |
− | <!-- /.navbar-collapse -->
| |
− | </div>
| |
− | <!-- /.container-fluid -->
| |
− | </nav>
| |
− |
| |
− | <!-- SECTION EN TETE, TOUJOURS VISIBLE -->
| |
− | <header>
| |
− | <div class="container">
| |
− | <div class="row">
| |
− | <div class="col-lg-12">
| |
− | <img class="img-responsive" src="http://i.imgur.com/Ya0O2yU.png" alt="">
| |
− | <div class="intro-text">
| |
− | <span class="name">IGEM project!</span>
| |
− | <hr class="star-light">
| |
− | <span class="skills">Polytech Marseille</span>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | </header>
| |
− |
| |
− |
| |
− | <!-- A PARTIR D'ICI ON GERE LES DIFFERENTS PAGE DU SITE -->
| |
− | <!-- DANS UNE DIV, METTRE l'EQUIVALENT d'une page -->
| |
− | <div class="page" data-page="pageHome" id="pageHome">
| |
− | <!-- Header -->
| |
− | <section class="wow fadeIn">
| |
− | <!-- <p>
| |
− | <img name="usaMap" src="http://davidjbradshaw.com/imagemap-resizer/example/images/ex1.gif" usemap="#m_usaMap" border="0" width="100%">
| |
− | </p>
| |
− | <map name="m_usaMap">
| |
− | <area href="http://en.wikipedia.org/wiki/California" shape="poly" coords="82,262,53,259,52,253,50,247,47,242,45,239,41,235,39,235,36,233,32,228,22,224,20,220,22,214,13,196,12,192,16,192,17,191,16,188,12,182,11,180,10,174,7,167,6,161,3,154,5,144,3,139,2,133,5,127,8,122,10,112,51,121,41,164,87,228,87,232,89,237,90,239,90,242,87,244,84,251,83,252,82,254,82,257,84,261,82,262" title="California">
| |
− | <area href="http://en.wikipedia.org/wiki/Colorado" shape="poly" coords="171,152,195,154,223,156,244,159,244,171,242,191,241,214,228,214,163,207,171,152" title="Colorado">
| |
− | <area href="http://en.wikipedia.org/wiki/Connecticut" shape="rect" coords="542,94,568,111" title="Connecticut">
| |
− | </map> -->
| |
− |
| |
− | <p>
| |
− | <img src="img/home.png" alt="" usemap="#Map" border="0" width="100%" />
| |
− | </p>
| |
− | <map name="Map" id="Map">
| |
− | <area alt="" title="" href="#pageHome" shape="poly" coords="573,665,613,666,627,643,637,615,630,592,607,579,570,576,554,607,554,635" />
| |
− | <area alt="" title="" href="#pageAbout" shape="poly" coords="141,613,177,631,193,666,180,694,151,702,120,711,83,681,88,630,122,606,149,611" />
| |
− | <area alt="" title="" href="#" shape="poly" coords="250,444,273,403,272,365,241,350,209,340,176,359,171,388,177,429,213,448" />
| |
− | <area alt="" title="" href="#" shape="poly" coords="201,311,243,296,249,235,220,208,148,214,126,263,161,299,196,311" />
| |
− | <area alt="" title="" href="#" shape="poly" coords="743,429,745,536,849,540,851,433" />
| |
− | <area alt="" title="" href="#" shape="poly" coords="895,252,900,350,1001,356,1008,258,898,251" />
| |
− | <area alt="" title="" href="#" shape="poly" coords="527,308,617,330,710,278,693,191,705,144,681,72,547,93" />
| |
− | <area alt="" title="" href="#" shape="poly" coords="980,124,973,184,1010,234,1085,206,1089,156,1054,120" />
| |
− | <area alt="" title="" href="#" shape="poly" coords="802,34,800,97,841,106,905,107,912,70,910,29,874,10,824,11" />
| |
− | <area alt="" title="" href="#" shape="poly" coords="354,113,373,45,334,22,293,21,256,49,255,89,277,105,300,129" />
| |
− | </map>
| |
− |
| |
− | </section>
| |
− |
| |
− | <!-- About Section -->
| |
− | <section class="success" id="about">
| |
− | <div class="container">
| |
− | <div class="row">
| |
− | <div class="col-lg-12 text-center wow bounceInUp">
| |
− | <h2>About</h2>
| |
− | <hr class="star-light">
| |
− | </div>
| |
− | </div>
| |
− | <div class="row">
| |
− | <div class="col-lg-4 col-lg-offset-2">
| |
− | <p>Freelancer is a free bootstrap theme created by Start Bootstrap. The download includes the complete source files including HTML, CSS, and JavaScript as well as optional LESS stylesheets for easy customization.</p>
| |
− | </div>
| |
− | <div class="col-lg-4">
| |
− | <p>Whether you're a student looking to showcase your work, a professional looking to attract clients, or a graphic artist looking to share your projects, this template is the perfect starting point!</p>
| |
− | </div>
| |
− | <div class="col-lg-8 col-lg-offset-2 text-center">
| |
− | <a href="#" class="btn btn-lg btn-outline">
| |
− | <i class="fa fa-download"></i> Download Theme
| |
− | </a>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | </section>
| |
− |
| |
− | <!-- Portfolio Grid Section -->
| |
− | <section id="portfolio">
| |
− | <div class="container">
| |
− | <div class="row">
| |
− | <div class="col-lg-12 text-center">
| |
− | <h2>Portfolio</h2>
| |
− | <hr class="star-primary">
| |
− | </div>
| |
− | </div>
| |
− | <div class="row">
| |
− | <div class="col-sm-4 portfolio-item wow fadeInLeft">
| |
− | <a href="#portfolioModal1" class="portfolio-link" data-toggle="modal">
| |
− | <div class="caption">
| |
− | <div class="caption-content">
| |
− | <i class="fa fa-search-plus fa-3x"></i>
| |
− | </div>
| |
− | </div>
| |
− | <img src="http://i.imgur.com/BSjAzFR.png" class="img-responsive" alt="">
| |
− | </a>
| |
− | </div>
| |
− | <div class="col-sm-4 portfolio-item">
| |
− | <a href="#portfolioModal2" class="portfolio-link" data-toggle="modal">
| |
− | <div class="caption">
| |
− | <div class="caption-content">
| |
− | <i class="fa fa-search-plus fa-3x"></i>
| |
− | </div>
| |
− | </div>
| |
− | <img src="http://i.imgur.com/bB0RWAU.png" class="img-responsive" alt="">
| |
− | </a>
| |
− | </div>
| |
− | <div class="col-sm-4 portfolio-item">
| |
− | <a href="#portfolioModal3" class="portfolio-link" data-toggle="modal">
| |
− | <div class="caption">
| |
− | <div class="caption-content">
| |
− | <i class="fa fa-search-plus fa-3x"></i>
| |
− | </div>
| |
− | </div>
| |
− | <img src="http://i.imgur.com/AcOMK2A.png" class="img-responsive" alt="">
| |
− | </a>
| |
− | </div>
| |
− | <div class="col-sm-4 portfolio-item">
| |
− | <a href="#portfolioModal4" class="portfolio-link" data-toggle="modal">
| |
− | <div class="caption">
| |
− | <div class="caption-content">
| |
− | <i class="fa fa-search-plus fa-3x"></i>
| |
− | </div>
| |
− | </div>
| |
− | <img src="http://i.imgur.com/h59amgM.png" class="img-responsive" alt="">
| |
− | </a>
| |
− | </div>
| |
− | <div class="col-sm-4 portfolio-item">
| |
− | <a href="#portfolioModal5" class="portfolio-link" data-toggle="modal">
| |
− | <div class="caption">
| |
− | <div class="caption-content">
| |
− | <i class="fa fa-search-plus fa-3x"></i>
| |
− | </div>
| |
− | </div>
| |
− | <img src="http://i.imgur.com/ldC0doB.png" class="img-responsive" alt="">
| |
− | </a>
| |
− | </div>
| |
− | <div class="col-sm-4 portfolio-item">
| |
− | <a href="#portfolioModal6" class="portfolio-link" data-toggle="modal">
| |
− | <div class="caption">
| |
− | <div class="caption-content">
| |
− | <i class="fa fa-search-plus fa-3x"></i>
| |
− | </div>
| |
− | </div>
| |
− | <img src="http://i.imgur.com/5vlHFHk.png" class="img-responsive" alt="">
| |
− | </a>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | </section>
| |
− | </div>
| |
− |
| |
− | <!-- UNE SECONDE PAGE, CACHEE PAR DEFAULT -->
| |
− | <div style="display:none" class="page" data-page="pageAbout" id="pageAbout">
| |
− | <!-- About 2 Section -->
| |
− | <section class="success" id="about2">
| |
− | <div class="container">
| |
− | <div class="row">
| |
− | <div class="col-lg-12 text-center wow bounceInUp">
| |
− | <h2>About 2</h2>
| |
− | <hr class="star-light">
| |
− | </div>
| |
− | </div>
| |
− | <div class="row">
| |
− | <div class="col-lg-4 col-lg-offset-2">
| |
− | <p>Freelancer is a free bootstrap theme created by Start Bootstrap. The download includes the complete source files including HTML, CSS, and JavaScript as well as optional LESS stylesheets for easy customization.</p>
| |
− | </div>
| |
− | <div class="col-lg-4">
| |
− | <p>Whether you're a student looking to showcase your work, a professional looking to attract clients, or a graphic artist looking to share your projects, this template is the perfect starting point!</p>
| |
− | </div>
| |
− | <div class="col-lg-8 col-lg-offset-2 text-center">
| |
− | <a href="#" class="btn btn-lg btn-outline">
| |
− | <i class="fa fa-download"></i> Download Theme
| |
− | </a>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | </section>
| |
− | </div>
| |
− |
| |
− | <!-- UNE TROISIEME PAGE, CACHEE PAR DEFAULT -->
| |
− | <div class="page" data-page="pageFoo" id="pageFoo">
| |
− | <!-- About 2 Section -->
| |
− | <section class="success" id="about2">
| |
− | <div class="container">
| |
− | <div class="row">
| |
− | <div class="col-lg-12 text-center wow bounceInUp">
| |
− | <h2>TITRE EXEMPLE</h2>
| |
− | <hr class="star-light">
| |
− | </div>
| |
− | </div>
| |
− | <div class="row">
| |
− | <div class="col-lg-4 col-lg-offset-2">
| |
− | <p>DU TEXTE</p>
| |
− | </div>
| |
− | <div class="col-lg-4">
| |
− | <p>ENCORE DU TEXTE</p>
| |
− | </div>
| |
− | <div class="col-lg-8 col-lg-offset-2 text-center">
| |
− | <a href="#" class="btn btn-lg btn-outline">
| |
− | <i class="fa fa-link"></i> UN LIEN VERS QQCH
| |
− | </a>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | </section>
| |
− | </div>
| |
− |
| |
− | <!-- Footer -->
| |
− | <footer class="text-center">
| |
− | <div class="footer-above">
| |
− | <div class="container">
| |
− | <div class="row">
| |
− | <div class="footer-col col-md-4">
| |
− | <h3>Location</h3>
| |
− | <p>3481 Melrose Place<br>Beverly Hills, CA 90210</p>
| |
− | </div>
| |
− | <div class="footer-col col-md-4">
| |
− | <h3>Around the Web</h3>
| |
− | <ul class="list-inline">
| |
− | <li>
| |
− | <a href="#" class="btn-social btn-outline"><i class="fa fa-fw fa-facebook"></i></a>
| |
− | </li>
| |
− | <li>
| |
− | <a href="#" class="btn-social btn-outline"><i class="fa fa-fw fa-google-plus"></i></a>
| |
− | </li>
| |
− | <li>
| |
− | <a href="#" class="btn-social btn-outline"><i class="fa fa-fw fa-twitter"></i></a>
| |
− | </li>
| |
− | <li>
| |
− | <a href="#" class="btn-social btn-outline"><i class="fa fa-fw fa-linkedin"></i></a>
| |
− | </li>
| |
− | <li>
| |
− | <a href="#" class="btn-social btn-outline"><i class="fa fa-fw fa-dribbble"></i></a>
| |
− | </li>
| |
− | </ul>
| |
− | </div>
| |
− | <div class="footer-col col-md-4">
| |
− | <h3>About Freelancer</h3>
| |
− | <p>Freelance is a free to use, open source Bootstrap theme created by <a href="http://startbootstrap.com">Start Bootstrap</a>.</p>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | <div class="footer-below">
| |
− | <div class="container">
| |
− | <div class="row">
| |
− | <div class="col-lg-12">
| |
− | Copyright © Your Website 2014
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | </footer>
| |
− |
| |
− | <!-- Scroll to Top Button (Only visible on small and extra-small screen sizes) -->
| |
− | <div class="scroll-top page-scroll visible-xs visible-sm">
| |
− | <a class="btn btn-primary" href="#page-top">
| |
− | <i class="fa fa-chevron-up"></i>
| |
− | </a>
| |
− | </div>
| |
− |
| |
− |
| |
− | <!-- LES BOXS QUI VONT S'OUVRIR QUAND ON CLIQUE SUR LES IMAGES DU PORTFOLIO -->
| |
− | <!-- Portfolio Modals -->
| |
− | <div class="portfolio-modal modal fade" id="portfolioModal1" tabindex="-1" role="dialog" aria-hidden="true">
| |
− | <div class="modal-content">
| |
− | <div class="close-modal" data-dismiss="modal">
| |
− | <div class="lr">
| |
− | <div class="rl">
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | <div class="container">
| |
− | <div class="row">
| |
− | <div class="col-lg-8 col-lg-offset-2">
| |
− | <div class="modal-body">
| |
− | <h2>Project Title</h2>
| |
− | <hr class="star-primary">
| |
− | <img src="img/portfolio/cabin.png" class="img-responsive img-centered" alt="">
| |
− | <p>Use this area of the page to describe your project. The icon above is part of a free icon set by <a href="https://sellfy.com/p/8Q9P/jV3VZ/">Flat Icons</a>. On their website, you can download their free set with 16 icons, or you can purchase the entire set with 146 icons for only $12!</p>
| |
− | <ul class="list-inline item-details">
| |
− | <li>Client:
| |
− | <strong><a href="http://startbootstrap.com">Start Bootstrap</a>
| |
− | </strong>
| |
− | </li>
| |
− | <li>Date:
| |
− | <strong><a href="http://startbootstrap.com">April 2014</a>
| |
− | </strong>
| |
− | </li>
| |
− | <li>Service:
| |
− | <strong><a href="http://startbootstrap.com">Web Development</a>
| |
− | </strong>
| |
− | </li>
| |
− | </ul>
| |
− | <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times"></i> Close</button>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | <div class="portfolio-modal modal fade" id="portfolioModal2" tabindex="-1" role="dialog" aria-hidden="true">
| |
− | <div class="modal-content">
| |
− | <div class="close-modal" data-dismiss="modal">
| |
− | <div class="lr">
| |
− | <div class="rl">
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | <div class="container">
| |
− | <div class="row">
| |
− | <div class="col-lg-8 col-lg-offset-2">
| |
− | <div class="modal-body">
| |
− | <h2>Project Title</h2>
| |
− | <hr class="star-primary">
| |
− | <img src="img/portfolio/cake.png" class="img-responsive img-centered" alt="">
| |
− | <p>Use this area of the page to describe your project. The icon above is part of a free icon set by <a href="https://sellfy.com/p/8Q9P/jV3VZ/">Flat Icons</a>. On their website, you can download their free set with 16 icons, or you can purchase the entire set with 146 icons for only $12!</p>
| |
− | <ul class="list-inline item-details">
| |
− | <li>Client:
| |
− | <strong><a href="http://startbootstrap.com">Start Bootstrap</a>
| |
− | </strong>
| |
− | </li>
| |
− | <li>Date:
| |
− | <strong><a href="http://startbootstrap.com">April 2014</a>
| |
− | </strong>
| |
− | </li>
| |
− | <li>Service:
| |
− | <strong><a href="http://startbootstrap.com">Web Development</a>
| |
− | </strong>
| |
− | </li>
| |
− | </ul>
| |
− | <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times"></i> Close</button>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | <div class="portfolio-modal modal fade" id="portfolioModal3" tabindex="-1" role="dialog" aria-hidden="true">
| |
− | <div class="modal-content">
| |
− | <div class="close-modal" data-dismiss="modal">
| |
− | <div class="lr">
| |
− | <div class="rl">
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | <div class="container">
| |
− | <div class="row">
| |
− | <div class="col-lg-8 col-lg-offset-2">
| |
− | <div class="modal-body">
| |
− | <h2>Project Title</h2>
| |
− | <hr class="star-primary">
| |
− | <img src="img/portfolio/circus.png" class="img-responsive img-centered" alt="">
| |
− | <p>Use this area of the page to describe your project. The icon above is part of a free icon set by <a href="https://sellfy.com/p/8Q9P/jV3VZ/">Flat Icons</a>. On their website, you can download their free set with 16 icons, or you can purchase the entire set with 146 icons for only $12!</p>
| |
− | <ul class="list-inline item-details">
| |
− | <li>Client:
| |
− | <strong><a href="http://startbootstrap.com">Start Bootstrap</a>
| |
− | </strong>
| |
− | </li>
| |
− | <li>Date:
| |
− | <strong><a href="http://startbootstrap.com">April 2014</a>
| |
− | </strong>
| |
− | </li>
| |
− | <li>Service:
| |
− | <strong><a href="http://startbootstrap.com">Web Development</a>
| |
− | </strong>
| |
− | </li>
| |
− | </ul>
| |
− | <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times"></i> Close</button>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | <div class="portfolio-modal modal fade" id="portfolioModal4" tabindex="-1" role="dialog" aria-hidden="true">
| |
− | <div class="modal-content">
| |
− | <div class="close-modal" data-dismiss="modal">
| |
− | <div class="lr">
| |
− | <div class="rl">
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | <div class="container">
| |
− | <div class="row">
| |
− | <div class="col-lg-8 col-lg-offset-2">
| |
− | <div class="modal-body">
| |
− | <h2>Project Title</h2>
| |
− | <hr class="star-primary">
| |
− | <img src="img/portfolio/game.png" class="img-responsive img-centered" alt="">
| |
− | <p>Use this area of the page to describe your project. The icon above is part of a free icon set by <a href="https://sellfy.com/p/8Q9P/jV3VZ/">Flat Icons</a>. On their website, you can download their free set with 16 icons, or you can purchase the entire set with 146 icons for only $12!</p>
| |
− | <ul class="list-inline item-details">
| |
− | <li>Client:
| |
− | <strong><a href="http://startbootstrap.com">Start Bootstrap</a>
| |
− | </strong>
| |
− | </li>
| |
− | <li>Date:
| |
− | <strong><a href="http://startbootstrap.com">April 2014</a>
| |
− | </strong>
| |
− | </li>
| |
− | <li>Service:
| |
− | <strong><a href="http://startbootstrap.com">Web Development</a>
| |
− | </strong>
| |
− | </li>
| |
− | </ul>
| |
− | <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times"></i> Close</button>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | <div class="portfolio-modal modal fade" id="portfolioModal5" tabindex="-1" role="dialog" aria-hidden="true">
| |
− | <div class="modal-content">
| |
− | <div class="close-modal" data-dismiss="modal">
| |
− | <div class="lr">
| |
− | <div class="rl">
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | <div class="container">
| |
− | <div class="row">
| |
− | <div class="col-lg-8 col-lg-offset-2">
| |
− | <div class="modal-body">
| |
− | <h2>Project Title</h2>
| |
− | <hr class="star-primary">
| |
− | <img src="img/portfolio/safe.png" class="img-responsive img-centered" alt="">
| |
− | <p>Use this area of the page to describe your project. The icon above is part of a free icon set by <a href="https://sellfy.com/p/8Q9P/jV3VZ/">Flat Icons</a>. On their website, you can download their free set with 16 icons, or you can purchase the entire set with 146 icons for only $12!</p>
| |
− | <ul class="list-inline item-details">
| |
− | <li>Client:
| |
− | <strong><a href="http://startbootstrap.com">Start Bootstrap</a>
| |
− | </strong>
| |
− | </li>
| |
− | <li>Date:
| |
− | <strong><a href="http://startbootstrap.com">April 2014</a>
| |
− | </strong>
| |
− | </li>
| |
− | <li>Service:
| |
− | <strong><a href="http://startbootstrap.com">Web Development</a>
| |
− | </strong>
| |
− | </li>
| |
− | </ul>
| |
− | <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times"></i> Close</button>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | <div class="portfolio-modal modal fade" id="portfolioModal6" tabindex="-1" role="dialog" aria-hidden="true">
| |
− | <div class="modal-content">
| |
− | <div class="close-modal" data-dismiss="modal">
| |
− | <div class="lr">
| |
− | <div class="rl">
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | <div class="container">
| |
− | <div class="row">
| |
− | <div class="col-lg-8 col-lg-offset-2">
| |
− | <div class="modal-body">
| |
− | <h2>Project Title</h2>
| |
− | <hr class="star-primary">
| |
− | <img src="img/portfolio/submarine.png" class="img-responsive img-centered" alt="">
| |
− | <p>Use this area of the page to describe your project. The icon above is part of a free icon set by <a href="https://sellfy.com/p/8Q9P/jV3VZ/">Flat Icons</a>. On their website, you can download their free set with 16 icons, or you can purchase the entire set with 146 icons for only $12!</p>
| |
− | <ul class="list-inline item-details">
| |
− | <li>Client:
| |
− | <strong><a href="http://startbootstrap.com">Start Bootstrap</a>
| |
− | </strong>
| |
− | </li>
| |
− | <li>Date:
| |
− | <strong><a href="http://startbootstrap.com">April 2014</a>
| |
− | </strong>
| |
− | </li>
| |
− | <li>Service:
| |
− | <strong><a href="http://startbootstrap.com">Web Development</a>
| |
− | </strong>
| |
− | </li>
| |
− | </ul>
| |
− | <button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-times"></i> Close</button>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− | </div>
| |
− |
| |
− |
| |
− | <!-- ON NE TOUCHE SURTOUT A RIEN DANS CE CODE A PARTIR D'ICI !!! -->
| |
− | <!-- Scripts -->
| |
− |
| |
− | <!-- jQuery -->
| |
− | <script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
| |
− |
| |
− | <!-- Bootstrap Core JavaScript -->
| |
− | <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js" integrity="sha256-Sk3nkD6mLTMOF0EOpNtsIry+s1CsaqQC1rVLTAy+0yc= sha512-K1qjQ+NcF2TYO/eI3M6v8EiNYZfA95pQumfvcVrTHtwQVDG+aHRqLi/ETn2uB+1JqwYqVG3LIvdm9lj6imS/pQ==" crossorigin="anonymous"></script>
| |
− |
| |
− | <!-- Plugin JavaScript -->
| |
− | <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>
| |
− | <script src="http://ironsummitmedia.github.io/startbootstrap-freelancer/js/classie.js"></script>
| |
− | <script src="http://ironsummitmedia.github.io/startbootstrap-freelancer/js/cbpAnimatedHeader.js"></script>
| |
− |
| |
− | <!-- Contact Form JavaScript -->
| |
− | <script src="http://ironsummitmedia.github.io/startbootstrap-freelancer/js/jqBootstrapValidation.js"></script>
| |
− | <script src="http://ironsummitmedia.github.io/startbootstrap-freelancer/js/contact_me.js"></script>
| |
− |
| |
− |
| |
− | <!-- Map resize -->
| |
− | <script type="text/javascript">
| |
− | !function(){"use strict";function a(){function a(){function a(a){function c(a){return a*b[1===(d=1-d)?"width":"height"]}var d=0;return a.split(",").map(Number).map(c).map(Math.floor).join(",")}for(var b={width:i.width/j.width,height:i.height/j.height},c=0;g>c;c++)f[c].coords=a(h[c])}function b(){j.onload=function(){(i.width!==j.width||i.height!==j.height)&&a()},j.src=i.src}function c(){function b(){clearTimeout(k),k=setTimeout(a,250)}window.addEventListener?window.addEventListener("resize",b,!1):window.attachEvent&&window.attachEvent("onresize",b)}function d(a){return a.coords.replace(/ *, */g,",").replace(/ +/g,",")}var e=this,f=e.getElementsByTagName("area"),g=f.length,h=Array.prototype.map.call(f,d),i=document.querySelector('img[usemap="#'+e.name+'"]'),j=new Image,k=null;b(),c()}function b(){function b(b){if(!b.tagName)throw new TypeError("Object is not a valid DOM element");if("MAP"!==b.tagName.toUpperCase())throw new TypeError("Expected <MAP> tag, found <"+b.tagName+">.");a.call(b)}return function(a){switch(typeof a){case"undefined":case"string":Array.prototype.forEach.call(document.querySelectorAll(a||"map"),b);break;case"object":b(a);break;default:throw new TypeError("Unexpected data type ("+typeof a+").")}}}"function"==typeof define&&define.amd?define([],b):"object"==typeof exports?module.exports=b():window.imageMapResize=b(),"jQuery"in window&&(jQuery.fn.imageMapResize=function(){return this.filter("map").each(a).end()})}();
| |
− | </script>
| |
− | <script type="text/javascript">
| |
− | $('map').imageMapResize();
| |
− | </script>
| |
− |
| |
− | <!-- Custom Theme JavaScript -->
| |
− | <script>
| |
− | $(function(){$("body").on("click",".page-scroll a",function(o){var l=$(this);$("html, body").stop().animate({scrollTop:$(l.attr("href")).offset().top},1500,"easeInOutExpo"),o.preventDefault()})}),$(function(){$("body").on("input propertychange",".floating-label-form-group",function(o){$(this).toggleClass("floating-label-form-group-with-value",!!$(o.target).val())}).on("focus",".floating-label-form-group",function(){$(this).addClass("floating-label-form-group-with-focus")}).on("blur",".floating-label-form-group",function(){$(this).removeClass("floating-label-form-group-with-focus")})}),$("body").scrollspy({target:".navbar-fixed-top"}),$(".navbar-collapse ul li a").click(function(){$(".navbar-toggle:visible").click()});
| |
− | </script>
| |
− |
| |
− | <script src="https://cdnjs.cloudflare.com/ajax/libs/wow/1.1.2/wow.min.js"></script>
| |
− | <script>
| |
− | new WOW().init(); //pour creer les animations
| |
− | </script>
| |
− |
| |
− | <script>
| |
− | //Simuler un changement de page
| |
− | $( "#pagesMenu a" ).click(function() {
| |
− | $('.page').not($(this).attr('href')).hide();
| |
− | $($(this).attr('href')).show();
| |
− | new WOW().init();
| |
− | });
| |
− | </script>
| |
− |
| |
− | </body>
| |
− |
| |
− | </html>
| |