Title: WordPress   parallax javascript
Last modified: August 19, 2016

---

# WordPress parallax javascript

 *  [nehuenmingote](https://wordpress.org/support/users/nehuenmingote/)
 * (@nehuenmingote)
 * [15 years, 9 months ago](https://wordpress.org/support/topic/wordpress-parallax-javascript/)
 * Hi, I’m a complete newbie in WordPress and php seeking for desperate help. That
   said, I’m trying to make a template based on the javascript parallax effect (
   [http://webdev.stephband.info/parallax.html](http://webdev.stephband.info/parallax.html)).
   I created a draft in html (which works perfectly fine) and then adapted it to
   the WordPress structure. I’ve been reading that WordPress has certain conflicts
   with javascript, I mean, it handles them differently, so I’ve tried to call the
   scripts as the WordPress Codex site explains -but had little success-. My main
   problem is that I don’t really know if I’m writing script properly. Here’s what
   I did:
 * (note: parallax plugin needs of JQuery and globals.js to work, so I need to call
   both scripts)
 * **header.php**
 *     ```
       <?php
       ?><!DOCTYPE html>
       <html <?php language_attributes(); ?>>
       <head>
       <link rel="stylesheet" type="text/css" href="wp-content/themes/AbrilTemplate/style.css" />
       <meta charset="<?php bloginfo( 'charset' ); ?>" />
   
       <?php
       function my_init() {
   
           wp_deregister_script( 'jquery' );
           wp_register_script( 'jquery', 'wp-content/themes/AbrilTemplate/js/jquery.min.js');
   
       	wp_enqueue_script('parallax', get_bloginfo('template_url') . 'wp-content/themes/AbrilTemplate/js/jquery.jparallax.js', array('jquery'));
   
       	wp_enqueue_script('global', get_bloginfo('template_url') . 'wp-content/themes/AbrilTemplate/js/global.js', array('jquery'));
   
       }
       add_action('wp_head', 'my_init');
       ?>
   
       </head>
   
       <body <?php body_class(); ?>>
       ```
   
 * **index.php**
 *     ```
       <?php get_header(); ?>
   
       <div id="content_header">
       	<div id="parallax">
           	<div id="tapiz"></div>
               <div id="escritorio">
               </div>
               </div>
               <div id="vignette"></div>
           </div>
   
       <?php get_footer(); ?>
       ```
   
 * **globals.js**
 *     ```
       $(document).ready(function(){
   
       	$('#tapiz').css({width:"1200px"});
       	$('#escritorio').css({width:"1024px"});
       	$('#vignette').css({width:"2048px"})
       	jQuery('#parallax').jparallax({triggerExposesEdges: true}, {xtravel: '20px', ytravel: '60px'}, {xtravel: '90px', ytravel: '80px'}, {xtravel: '10px', ytravel: '55px'}, {xtravel: '-20px'}, {ytravel: '-45'}).append(corners);
   
       });
       ```
   
 * What am I doing wrong? Could somebody help me solve my problem? Thank you VERY
   much in advanced 🙂
 * **Neh**

Viewing 1 replies (of 1 total)

 *  [mckn](https://wordpress.org/support/users/mckn/)
 * (@mckn)
 * [14 years, 11 months ago](https://wordpress.org/support/topic/wordpress-parallax-javascript/#post-1661443)
 * Did you ever figure it out?
 * The same thing is happening with me. Through regular html, the page I’ve setup
   with the parallax effect works fine, not in WordPress.
 * I’ve tried to call jquery and parallax through enqueue in the header as well 
   as through regular script calls… all to no avail.
 * Any help would be very much appreciated.
    Sean

Viewing 1 replies (of 1 total)

The topic ‘WordPress parallax javascript’ is closed to new replies.

## Tags

 * [javascript](https://wordpress.org/support/topic-tag/javascript/)
 * [jquery](https://wordpress.org/support/topic-tag/jquery/)
 * [script](https://wordpress.org/support/topic-tag/script/)

 * In: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/)
 * 1 reply
 * 2 participants
 * Last reply from: [mckn](https://wordpress.org/support/users/mckn/)
 * Last activity: [14 years, 11 months ago](https://wordpress.org/support/topic/wordpress-parallax-javascript/#post-1661443)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics
