javascript - Make One Page Scroll to work -


i'm using 1 page scroll create single page scroll effect seen here.

it worked fine locally, in jsfiddle

html:

<div class="embrulho">     <div class="corpo">         <section class="page1">             <div class="page_container">                  <h1>benefício1</h1>                   <h2>qualquer coisa de especial!</h2>                  <p>created yoooo</p>             </div>             <img src="http://www.portal-gestao.com/app/onepage/back-phone.png" alt="phones">         </section>         <section class="page2">             <div class="page_container">                  <h1>benefício 2</h1>                   <h2>ebudget é tudo o que precisas man...</h2>     <code class="js">                       $(".corpo").onepage_scroll();                     </code>              </div>         </section>         <section class="page3">             <div class="page_container">                  <h1>É muita bonito não!?</h1>                   <h2>É mesmo lindo!</h2>              </div>         </section>     </div> </div> 

js:

$(document).ready(function () {     $(".corpo").onepage_scroll({         sectioncontainer: "section",         responsivefallback: 600,         loop: true     }); }); 

css:

.embrulho {     height: 100% !important;     height: 100%;     margin: 0 auto;     overflow: hidden; } .corpo {     float: left;     width: 100%;     margin: 0 auto; } .corpo section {     overflow: hidden; } .corpo section .page_container {     position: relative;     top: 25%;     margin: 0 auto 0;     max-width: 950px;     z-index: 3; } .corpo section.page2 {     background: #555557 url('../onepage/phones.png') no-repeat center -150px; } .corpo section.page2 .page_container {     margin-top: 240px;     overflow: hidden; } .corpo section .page_container {     position: relative;     top: 25%;     margin: 0 auto 0;     max-width: 950px;     z-index: 3; } code {     margin: 20px 1%;     float: left;     width: 48%;     height: 105px;     background: rgba(0, 0, 0, 0.1);     border: rgba(0, 0, 0, 0.05) 5px solid;     border-radius: 5px;     padding:5px;     color: white;     text-align: center;     font-size: 15px;     margin-top: 25px;     display: block;     box-sizing: border-box;     -webkit-box-sizing: border-box;     -moz-box-sizing: border-box; } code.html {     color: #7ec9e6; } code.js {     color: #ffad00; } 

but isn't working on server, guess due conflicts template. see here.

i tried detecting , cleaning conflicts as possible, couldn't figured out why not working?

i solved creating folder out of joomla.


Comments

Popular posts from this blog

android - Get AccessToken using signpost OAuth without opening a browser (Two legged Oauth) -

org.mockito.exceptions.misusing.InvalidUseOfMatchersException: mockito -

google shop client API returns 400 bad request error while adding an item -