Tabs





1.Login to your Blogger account and then Go to Design > Edit HTML.



2.Search for </head> tag and then paste the following code just Above/Before it.

<script type="text/javascript" src="http://dl.dropbox.com/u/27675057/jquery-1.2.6.min.js"></script>  
 <script type="text/javascript" src="http://dl.dropbox.com/u/27675057/jquery.jparallax.js"></script>  
 <script type="text/javascript">  
 jQuery(document).ready(function(){  
  jQuery('#parallax').jparallax({});  
 });  
 </script>  



3. Now search for the </b:skin> tag and then copy the following code just Above/Before it.


#parallax {
background:#ccc;   
  position:absolute;   
  overflow:hidden;  
  width:970px;   
  height:200px;   
 }  
   
Please Note: The width and height depends on the dimensions of the images you are using


4.Now copy the following code either in the Page or Post or Gadget ,where you want to use it
<div id="parallax">  
 <img src="http://dl.dropbox.com/u/27675057/Capturegfhf_2.PNG" alt=""style="width:1323px; height:224px;" />    
    <img src="http://dezignus.com/wp-content/themes/dezignus/images/head_4-trans.png" alt="" style="width:1123px; height:224px;"/>  
    <img src="http://dezignus.com/wp-content/themes/dezignus/images/head_3-trans.png" alt="" style="width:1240px; height:224px;"/>  
    <img src="http://dezignus.com/wp-content/themes/dezignus/images/head_2-trans.png" alt="" style="width:1320px; height:224px;"/>  
    <img src="http://dezignus.com/wp-content/themes/dezignus/images/head_1-trans.png" alt="" style="width:1440px; height:224px;"/>  
   </div>
1.Login to your Blooger account and then Go to Design > Page Elements.



2.Click on Add a Gadget and select HTML/Javascript .



3. Now copy the code from below and paste it into the HTML/Javascript element and then Save it.

<script type="text/javascript" src="http://dl.dropbox.com/u/27675057/jquery-1.2.6.min.js"></script>  
 <script type="text/javascript" src="http://dl.dropbox.com/u/27675057/jquery.jparallax.js"></script>  
 <script type="text/javascript">  
 jQuery(document).ready(function(){  
  jQuery('#parallax').jparallax({});  
 });  
 </script>  
 <style type="text/CSS">  
 #parallax {  
  background:#ccc;   
  position:absolute;   
  overflow:hidden;  
  width:970px;   
  height:200px;   
 }  
 </style>  
  <div id="parallax">  
 <img src="http://dl.dropbox.com/u/27675057/Capturegfhf_2.PNG" alt=""style="width:1323px; height:224px;" />    
    <img src="http://dezignus.com/wp-content/themes/dezignus/images/head_4-trans.png" alt="" style="width:1123px; height:224px;"/>  
    <img src="http://dezignus.com/wp-content/themes/dezignus/images/head_3-trans.png" alt="" style="width:1240px; height:224px;"/>  
    <img src="http://dezignus.com/wp-content/themes/dezignus/images/head_2-trans.png" alt="" style="width:1320px; height:224px;"/>  
    <img src="http://dezignus.com/wp-content/themes/dezignus/images/head_1-trans.png" alt="" style="width:1440px; height:224px;"/>  
   </div>

No comments:

Post a Comment