commit du 18 12 2013

diff --git a/css/style-1000px.css b/css/style-1000px.css
index 610e22cca8628ac959ca811d02a62f76cbc3d05c..fdb741539888d49a96c3fbde4d47f119c52a45ee 100644 (file)
--- a/css/style-1000px.css
+++ b/css/style-1000px.css
@@ -39,12 +39,12 @@
 
        #header-wrapper
        {
-               height: 595px !important;
+               height: 595px;
        }
                        
        .homepage #header-wrapper
        {
-                       height: 595px;
+                       height: 690px;
        }
 
        #intro-wrapper
@@ -72,7 +72,7 @@
        
        .homepage #header
        {
-                       height: 623px;
+                       height: 723px;
        }
 
 /*********************************************************************************/
@@ -297,8 +297,23 @@
        width:960px;
        height:540px;
        }
-
-               #main-features
+       
+       #top
+       {
+       margin-top:55px;
+       width:960px;
+       height:540px;
+       position: relative; 
+       margin-left: auto;
+       margin-right: aut               
+       }
+       #top iframe 
+       {
+       width:960px;
+       height:540px;;
+       }
+       
+       #main-features
        {
                padding: 0 3em 0 3em;
        }
@@ -617,7 +632,65 @@
     }
        
        
+/*_____________________________________________________________________*/
+/* Deplacement  scroll to */
+/*_____________________________________________________________________*/
+
+ #h-workflow 
+       {
+       position:absolute;
+       width: 100%;
+       height: 6em;
+       background-color: rgb(255,255,255);
+       margin-top:-10em;
+       }
+
+
+       
+#h-logiciels
+       {
+       position:absolute;
+       width: 100%;
+       height: 6em;
+       background-color: rgba(255,255,255,0);
+       margin-top:-12em;
+       }
+       
+#h-solutions
+       {
+       position:absolute;
+       width: 100%;
+       height: 6em;
+       background-color: rgba(255,255,255,0);
+       margin-top:-14em;
+       }
+       
+#h-prestations
+       {
+       position:absolute;
+       width: 100%;
+       height: 6em;
+       background-color: rgba(255,255,255,0);
+       margin-top:-14em;
+       }
        
+#h-references
+       {
+       position:absolute;
+       width: 100%;
+       height: 6em;
+       background-color: rgba(255,255,255,0);
+       margin-top:-14em;
+       }
+
+#h-contacts
+       {
+       position:absolute;
+       width: 100%;
+       height: 6em;
+       background-color: rgba(255,255,255,0);
+       margin-top:-10em
+       }       
 /*********************************************************************************/
 /* tablette                                                          */
 /*********************************************************************************/

diff --git a/css/style-desktop.css b/css/style-desktop.css
index 2ea53ee3d7c0e95b7256265bf1155f09342e45d8..9f4e8598740b557ead752c722878dfabaa6024d4 100644 (file)
--- a/css/style-desktop.css
+++ b/css/style-desktop.css
@@ -332,7 +332,7 @@
 
                .homepage #header-wrapper
                {
-                       height: 736px;
+                       height: 840px;
                }
 
        #intro-wrapper
@@ -565,6 +565,7 @@
                position: relative;
                padding: 0em 0 0em 0;
                }
+               
                #video-home
                {
                margin-top:60px;
@@ -579,6 +580,21 @@
                width:1200px;
                height:676px;
                }
+               
+               #top
+               {
+               margin-top:60px;
+               width:1200px;
+               height:676px;
+               position: relative; 
+               margin-left: auto;
+               margin-right: auto              
+               }
+               #top iframe 
+               {
+               width:1200px;
+               height:676px;
+               }
 /*********************************************************************************/
 /* Intro                                                                         */
 /*********************************************************************************/
@@ -685,7 +701,7 @@
 /*********************************************************************************/
        #logiciels-wrapper
        {
-               padding-bottom: 6em;
+               padding-bottom: 7em;
                padding-top: 6em;
        }
 
@@ -815,7 +831,7 @@
 
        #prestations-wrapper
        {
-               padding-bottom: 6em;
+               padding-bottom: 8em;
                padding-top: 8em;
        }
        
@@ -1406,69 +1422,59 @@
 /* Deplacement  scroll to */
 /*_____________________________________________________________________*/
 
-
-#h-workflow
+ #h-workflow 
        {
+       position:absolute;
        width: 100%;
        height: 6em;
-       margin-top:0em;
-       margin-bottom:0em;
-       background-color: rgba(255,255,255,0.0);
+       background-color: rgb(255,255,255);
+       margin-top:-12em;
        }
 
 
        
 #h-logiciels
        {
+       position:absolute;
        width: 100%;
        height: 6em;
-       padding-bottom: -4em;
-       margin-bottom:-3em;
-       background-color: rgba(255,255,255,0.0);
-       margin-top:3em;
-       margin-bottom:-6em;
+       background-color: rgba(255,255,255,0);
+       margin-top:-12em;
        }
        
 #h-solutions
        {
+       position:absolute;
        width: 100%;
        height: 6em;
-       padding-bottom: -4em;
-       margin-bottom:-3em;
-       background-color: rgba(255,255,255,0.0);
-       margin-top:3em;
-       margin-bottom:-6em;
+       background-color: rgba(255,255,255,0);
+       margin-top:-14em;
        }
        
 #h-prestations
        {
+       position:absolute;
        width: 100%;
        height: 6em;
-       padding-bottom: -4em;
-       margin-bottom:-3em;
-       background-color: rgba(255,255,255,0.0);
-       margin-top:3em;
-       margin-bottom:-6em;
+       background-color: rgba(255,255,255,0);
+       margin-top:-14em;
        }
        
 #h-references
        {
+       position:absolute;
        width: 100%;
        height: 6em;
-       padding-bottom: -4em;
-       margin-bottom:-3em;
-       background-color: rgba(255,255,255,0.0);
-       margin-top:3em;
-       margin-bottom:-6em;
+       background-color: rgba(255,255,255,0);
+       margin-top:-14em;
        }
 
 #h-contacts
        {
+       position:absolute;
        width: 100%;
        height: 6em;
-       padding-bottom: -4em;
-       background-color: rgba(255,255,255,0.0);
-       margin-top:3em;
-       margin-bottom:-6em;
+       background-color: rgba(255,255,255,0);
+       margin-top:-12em
        }
 

diff --git a/css/style-mobile.css b/css/style-mobile.css
index 23a7d6aea7cc03f2423266beae49cb92cc2ac255..219ab9838f9bd8728f368c67800b7678c7ff7374 100644 (file)
--- a/css/style-mobile.css
+++ b/css/style-mobile.css
@@ -392,6 +392,15 @@
                padding: 0em 0em 0em 0em;
                height: 224px;
        }
+       
+       
+       .homepage #header-wrapper
+               {
+                       padding: 0em 0em 0em 0em;
+                       height: 420px;
+                       background-color:#1230;
+               }
+
 
        #footer-wrapper
        {
@@ -411,7 +420,7 @@
        #header
        {
        margin-top:34px;
-       height: 180px;
+       height: 300px;
        }
 
 /*********************************************************************************/
@@ -451,7 +460,7 @@
 /* video home                                                                        */
 /*********************************************************************************/
 
-.wrapper-video
+ .wrapper-video
                {
                position: relative;
                padding: 0em 0 0em 0;
@@ -471,6 +480,21 @@
                height:180px;
                }
                
+               #top
+               {
+               margin-top:34px;
+               margin-left: auto;
+               margin-right: auto;
+               width:320px;
+               height:300px;           
+               }
+               
+               #top iframe 
+               {
+               width:320px;
+               height:300px;
+               }
+               
                #main iframe 
                {
                width:320px;
@@ -535,7 +559,7 @@
 
        #prestations-wrapper
        {
-               padding-bottom: 3em;
+               padding-bottom: 5em;
                padding-top: 3em;
        }
        
@@ -1009,68 +1033,77 @@
 
 #h-workflow
        {
-       width: 100%;
+       position:absolute;
+       text-align:center;
+       display:block;
+       width: 92%;
        height: 6em;
-       margin-top:0em;
-       margin-bottom:0em;
-       background-color: rgba(255,255,255,0.0);
+       top:0em;
+       margin-top:-6em;
+       background-color: rgba(255,255,255,0);
        }
 
 
        
 #h-logiciels
        {
-       width: 100%;
+       position:absolute;
+       text-align:center;
+       display:block;
+       width: 92%;
        height: 6em;
-       padding-bottom: -4em;
-       margin-bottom:-3em;
-       background-color: rgba(255,255,255,0.0);
-       margin-top:3em;
-       margin-bottom:-6em;
+       top:0em;
+       margin-top:-6em;
+       background-color: rgba(255,255,255,0);
        }
        
 #h-solutions
        {
-       width: 100%;
-       height: 7em;
-       padding-bottom: -4em;
-       margin-bottom:-3em;
-       background-color: rgba(255,255,255,0.0);
-       margin-top:3em;
-       margin-bottom:-6em;
+       position:absolute;
+       text-align:center;
+       display:block;
+       width: 92%;
+       height: 6em;
+       top:0em;
+       margin-top:-6em;
+       background-color: rgba(255,255,255,0);
        }
        
 #h-prestations
        {
-       width: 100%;
-       height: 7em;
-       padding-bottom: -4em;
-       margin-bottom:-3em;
-       background-color: rgba(255,255,255,0.0);
-       margin-top:3em;
-       margin-bottom:-6em;
+       position:absolute;
+       text-align:center;
+       display:block;
+       width: 92%;
+       height: 6em;
+       top:0em;
+       margin-top:-6em;
+       background-color: rgba(255,255,255,0);
        }
        
 #h-references
        {
-       width: 100%;
-       height: 7em;
-       padding-bottom: -4em;
-       margin-bottom:-3em;
-       background-color: rgba(255,255,255,0.0);
-       margin-top:3em;
-       margin-bottom:-3em;
+       position:absolute;
+       text-align:center;
+       display:block;
+       width: 92%;
+       height: 6em;
+       top:0em;
+       margin-top:-6em;
+       background-color: rgba(255,255,255,0);
        }
 
 #h-contacts
        {
-       width: 100%;
-       height: 7em;
-       padding-bottom: -4em;
-       background-color: rgba(255,255,255,0.0);
-       margin-top:3em;
-       margin-bottom:-6em;
-       }}
+       position:absolute;
+       text-align:center;
+       display:block;
+       width: 92%;
+       height: 6em;
+       top:0em;
+       margin-top:-6em;
+       background-color: rgba(255,255,255,0);
+       }
 
 
 

diff --git a/css/style.css b/css/style.css
index 3b1a637aea62ecf86d8f7cfedfd9e18572e2bce1..eb3079c1db9fde9e0a59329645ca2e0c38bb1a72 100644 (file)
--- a/css/style.css
+++ b/css/style.css
@@ -1090,40 +1090,59 @@
 /* Deplacement  scroll to */
 /*_____________________________________________________________________*/
 
-#h-workflow
+ #h-workflow 
        {
-
+       position:absolute;
+       width: 100%;
+       height: 6em;
+       background-color: rgb(255,255,255);
+       margin-top:-12em;
        }
 
 
        
 #h-logiciels
        {
-
-
+       position:absolute;
+       width: 100%;
+       height: 6em;
+       background-color: rgba(255,255,255,0);
+       margin-top:-12em;
        }
        
 #h-solutions
        {
-
-
+       position:absolute;
+       width: 100%;
+       height: 6em;
+       background-color: rgba(255,255,255,0);
+       margin-top:-14em;
        }
        
 #h-prestations
        {
-
-
+       position:absolute;
+       width: 100%;
+       height: 6em;
+       background-color: rgba(255,255,255,0);
+       margin-top:-14em;
        }
        
 #h-references
        {
-
-
+       position:absolute;
+       width: 100%;
+       height: 6em;
+       background-color: rgba(255,255,255,0);
+       margin-top:-14em;
        }
 
-
 #h-contacts
        {
- 
-
+       position:absolute;
+       width: 100%;
+       height: 6em;
+       background-color: rgba(255,255,255,0);
+       margin-top:-12em
        }
+

diff --git a/ifr-mobile-web-tv.html b/ifr-mobile-web-tv.html
index ae9b64248a1c06c83699de5c3f3e727f008a4b0d..36169dbbae688839003655b097303837174407df 100644 (file)
--- a/ifr-mobile-web-tv.html
+++ b/ifr-mobile-web-tv.html
@@ -15,25 +15,16 @@
   <script src="js/modernizr.custom.js"></script>
   <script src="js/video.js"></script>
   
-  <script>
-    videojs.options.flash.swf = "swf/video-js.swf";
-  </script>
+  <script> videojs.options.flash.swf = "swf/video-js.swf"; </script>
   
  </head>
- 
- 
- 
  <body class="color01"> 
   <div class="pt-triggers">
    <button id="iterateEffects" class="pt-touch-button"></button>
    <div id="dl-menu" class="dl-menuwrapper">
     <ul class="dl-menu">
-     <li>
-      <ul class="dl-submenu">
        <li data-animation="1"><a href="#"></a></li>
-      </ul>
-     </li>
-    </ul>     
+     </ul>    
    </div><!-- /dl-menu-wrapper-->
   </div><!-- /triggers -->
     

diff --git a/img/pic02.psd b/img/pic02.psd
index ecf8530cee85b0d71e0df2b33e5bc8f8a4bfbf98..c721be712f0de195f2eaff613ee0e1b604f87337 100644 (file)
Binary files a/img/pic02.psd and b/img/pic02.psd differ

diff --git a/img/pic04.jpg b/img/pic04.jpg
index a9c68a196db406b1ff017560226a56376171186e..38483def6318f532453642a5246710967428e99e 100644 (file)
Binary files a/img/pic04.jpg and b/img/pic04.jpg differ

diff --git a/img/pic06.jpg b/img/pic06.jpg
index d8fb52d4c086312b1cb535354fe9e63333c89c31..dbb9734e66dcd563f1b209c1061d6061c3a5f1c6 100644 (file)
Binary files a/img/pic06.jpg and b/img/pic06.jpg differ

diff --git a/index.html b/index.html
index b6374070b750b159032c6e21cd61fa929d6b1f5f..1fd7ddfaaea77090a3ad70e02e97b882c2167251 100644 (file)
--- a/index.html
+++ b/index.html
@@ -31,23 +31,18 @@
  </head>
  
  <body class="homepage" onload="initMap()" >
-   <!-- Header Wrapper -->
-   <div class="color01" id="header-wrapper" >
-    <div class="container">
-     <div class="row">
-      <div class="12u">
-         <!-- nav back--> 
-         <div id="nav-back" class="skel-panels-fixed color09">       
+ <!-- nav back--> 
+         <div id="nav-back" class="skel-panels-fixed color09">  
           <!-- Nav -->
                        <!-- Logo -->
            <div id="logo" >
-           <a href="index.html#" ><img src="img/logo-telecasting-site.svg" alt="telecasting mobile web tv" /></a>
+           <a href="#top" ><img src="img/logo-telecasting-site.svg" alt="telecasting mobile web tv" /></a>
            </div>
            <!-- /Logo -->      
           <nav id="nav" >        
           <ul>
             <!-- usage & workflow -->
-            <li class="current_page_item"><a href="index.html#h-workflow">usage & workflow</a></li>
+            <li class="current_page_item"><a href="#h-workflow">usage & workflow</a></li>
             <li>
              <span ><img src="img/bouton-menu.svg" alt="mobile live web tv" /></span>
              <ul>
@@ -60,7 +55,7 @@
             <!-- /usage & workflow -->
             
             <!-- logiciels -->
-            <li class="current_page_item"><a href="index.html#h-logiciels">logiciels</a></li>            
+            <li class="current_page_item"><a href="#h-logiciels">logiciels</a></li>            
             <li>
              <span ><img src="img/bouton-menu.svg" alt="mobile live web tv" /></span>
              <ul>
@@ -72,7 +67,7 @@
             <!-- /logiciels -->
             
             <!-- solutions -->
-            <li class="current_page_item"><a href="index.html#h-solutions">solutions</a></li>
+            <li class="current_page_item"><a href="#h-solutions">solutions</a></li>
             <li>
              <span ><img src="img/bouton-menu.svg" alt="mobile live web tv" /></span>
              <ul>
@@ -86,7 +81,7 @@
             <!-- /solutions -->
             
             <!-- prestations -->
-            <li class="current_page_item"><a href="index.html#h-prestations">prestations</a></li>
+            <li class="current_page_item"><a href="#h-prestations">prestations</a></li>
             <li>
              <span ><img src="img/bouton-menu.svg" alt="mobile live web tv" /></span>
              <ul>
@@ -101,7 +96,7 @@
             <!-- /prestations -->
             
             <!-- references -->
-            <li class="current_page_item"><a href="index.html#h-references">references</a></li>
+            <li class="current_page_item"><a href="#h-references">references</a></li>
             <li>
              <span ><img src="img/bouton-menu.svg" alt="mobile live web tv" /></span>
              <ul>
@@ -112,7 +107,7 @@
             <!-- /references -->
             
             <!-- contacts -->
-            <li class="current_page_item"><a href="index.html#h-contacts">contacts</a></li>
+            <li class="current_page_item"><a href="#h-contacts">contacts</a></li>
             <li>
              <span ><img src="img/bouton-menu.svg" alt="mobile live web tv" /></span>
              <ul>
@@ -120,20 +115,23 @@
               <li><a href="mentions-legales.html">mentions légales</a></li>
              </ul>
             </li>
-                       <!-- /contacts -->
-                       
-            </ul>
-       
-                       
+                       <!-- /contacts -->                      
+            </ul>              
            </nav>
            <!-- /Nav --> 
            </div>
-           <!-- /nav back-->          
+           <!-- /nav back-->
+                  
+   <!-- Header Wrapper -->
+   <div class="color01" id="header-wrapper" >
+    <div class="container">
+     <div class="row">
+      <div class="12u">
     <!-- Header -->
     <div id="header" class="wrapper-video"> 
-    <div id="video-home">
+    <article id="top">
     <iframe src="ifr-home.html" ></iframe>    
-    </div>        
+    </article>        
     <!-- /Header -->
     </div>
    </div>
@@ -143,8 +141,8 @@
 <!-- /Header Wrapper -->
 
 <!-- Main Wrapper -->
-<div id="h-workflow"></div>
  <div class="wrapper wrapper-style2 color10">
+ <article id="h-workflow"></article>
   <div class="title Bcolor01 Tcolor01 color10">usage & workflow</div>
    <div class="container">
     <div class="row">
@@ -197,13 +195,13 @@
      </div>
     </div>
    </div>
-   <div id="h-logiciels"></div>
   </div>
 <!-- /Main Wrapper -->
 
 <!-- logiciels Wrapper -->
 
  <div id="logiciels-wrapper" class="wrapper color01">
+ <article id="h-logiciels"></article>
   <div  class="title color01 Tcolor10">logiciels</div>
    <div class="container">
     <div class="row">
@@ -271,12 +269,12 @@
       </div>
      </div>
     </div>
-       <div id="h-solutions"></div>
    </div>
   <!-- /logiciels Wrapper --> 
   <!-- solutions Wrapper -->
   
    <div id="solutions-wrapper" class="wrapper color02">
+   <article id="h-solutions"></article>
     <div class="title color02 Tcolor10">solutions</div>
     <div class="container">
      <div class="row">
@@ -343,12 +341,11 @@
        </div>
       </div>
      </div>
-        <div id="h-prestations"></div>
     </div>
         <!-- /solutions Wrapper -->
   <!-- prestations Wrapper -->
-
    <div id="prestations-wrapper" class="wrapper wrapper-style2">
+   <article id="h-prestations"></article>
     <div  class="title Bcolor01 Tcolor01 color10">prestations</div>
      <div class="container">
       <div class="row">
@@ -434,12 +431,11 @@
        </div>     
       </div>
      </div>
-        <div id="h-references"></div>
     </div>
   <!-- /prestations Wrapper -->
   <!-- references Wrapper -->
-
    <div id="references-wrapper" class="wrapper wrapper-style2 color05">
+       <article id="h-references"></article>
     <div class="title Bcolor10 Tcolor10 color05">references</div>
     <div class="container">
      <div class="row">
@@ -520,14 +516,13 @@
       </div>
      </div>
     </div>
-       <div id="h-contacts"></div>
    </div>
   <!-- /references Wrapper -->
 
-  </div>
   <!-- Footer Wrapper -->
 
    <div id="footer-wrapper" class="wrapper wrapper-style2 color01">
+       <article id="h-contacts"></article>
     <div class="title color01 Tcolor10 Bcolor10">contacts</div>
     <div class="container">
      <div class="row">

diff --git a/js/config.js b/js/config.js
index db937f3ed67a523750238e4ef6f1454d45c06818..4e8337fed82bab92bbe6802ae4de78187e6bd032 100644 (file)
--- a/js/config.js
+++ b/js/config.js
@@ -31,6 +31,22 @@ jQuery(function() {
                        detach: false
                });
                
+               var     _bh = jQuery('body, html'),
+               _window = jQuery(window),
+               _nav = jQuery('#nav');
+
+       
+       // Links
+               jQuery('a').click(function(e) {
+                       var t = jQuery(this), h = t.attr('href'), article;
+
+                       if (h.charAt(0) == '#' && h.length > 1 && (article = jQuery('article#' + h.substring(1))).length > 0)
+                       {
+                               var pos = Math.max(article.parent().offset().top - _nav.height() + -45, 0);
+                               e.preventDefault();
+                               _bh.animate({ scrollTop: pos }, 'slow', 'swing');
+                       }
+               });
        // Forms (IE <= 9 only)
                if (jQuery.browser.msie && jQuery.browser.version <= 9)
                        jQuery('form').n33_formerize();