Wordpress Themes - WP Forum at BFA
Click here to register or to donate.
Auto self-registration is not available here - far too many spammers. This forum has many, many backlinks and because of that there is an intense desire among spammers to drop their links here.

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme »

How to properly add Javascript?!? --- HELP!

Old Feb 4, 2012, 06:06 PM
1 posts · Feb 2012
I have a bunch of custom javascript/jQuery added to the "add HTML/CSS" inserts but there is a problem...

I can't use any plug-ins that use javascript because they conflict with the current code I have!

I know that my main problem is calling the javascript/jQuery correctly, I just have no idea on how to call the jQuery that is already included with wordpress that way there are no conflicts of calling jQuery a bunch of times.

This is my site (that i have to finish for school next week!), the custom stuff is a pop up footer, a navigation that sticks to the top, and a little animated line under the navigation links... titosoto.com

Here is the code that I added to the "Header";

<! This is the DIV stick to the top !>

<script type="text/javascript">
jQuery(function($) {
// Check the initial Poistion of the Sticky Header
var stickyHeaderTop = $('#stickyheader').offset().top;

if( $(window).scrollTop() > stickyHeaderTop ) {
$('#stickyheader').css({position: 'fixed', top: '0px'});
} else {
$('#stickyheader').css({position: 'static', top: '0px'});


<script type="text/javascript">
jQuery(function($) {
var open = false;
$('#footerSlideButton').click(function () {
if(open === false) {
$('#footerSlideContent').animate({ height: '300px' });
$(this).css('backgroundPosition', 'bottom left');
open = true;
} else {
$('#footerSlideContent').animate({ height: '0px' });
$(this).css('backgroundPosition', 'top left');
open = false;


<script type="text/javascript">
jQuery(function($) {

var $el, leftPos, newWidth;
$mainNav2 = $("#example-two");

/* Add Magic Line markup via JavaScript, because it ain't gonna work without */
$("#example-one").append("<li id='magic-line'></li>");

/* Cache it */
var $magicLine = $("#magic-line");

.css("left", $(".current_page_item a").position().left)
.data("origLeft", $magicLine.position().left)
.data("origWidth", $magicLine.width());

$("#example-one li").find("a").hover(function() {
$el = $(this);
leftPos = $el.position().left;
newWidth = $el.parent().width();

left: leftPos,
width: newWidth
}, function() {
left: $magicLine.data("origLeft"),
width: $magicLine.data("origWidth")



So, anyone know hoy my code would look like to stop all this javascript/jQuery conflict?!

all plug-ins work but then none of my custom stuff works... NOTE im not a programmer AT ALL, im a graphic design student.

Last edited by basslover911; Feb 4, 2012 at 10:18 PM.
Old Dec 25, 2012, 09:07 AM
36 posts · Apr 2011
Hi, from Russia.
I do not quite understand your question, but maybe it will help.

This is a syntax issue, the jQuery library included with WordPress loads in "no conflict" mode. This is to prevent compatibility problems with other javascript libraries that WordPress can load. In "no-confict" mode, the $ shortcut is not available and the longer jQuery is used, i.e.

jQuery(document).ready(function ($) {

By including the $ in parenthesis after the function call you can then use this shortcut within the code block.
Old Dec 25, 2012, 09:16 AM
36 posts · Apr 2011
Vslider plugin did not work with my jquery code, because I have twice used the same library (jquery.min.js - my and WP), then i changed my code from:
$('div#menutop li').each(function () {if (this.getElementsByTagName("a")[0].href == location.href) this.className = "current";});
jQuery('div#menutop li').each(function () {if (this.getElementsByTagName("a")[0].href == location.href) this.className = "current";});
And deleted my row from header:
<script src="http://yandex.st/jquery/1.6.4/jquery.min.js"></script>
- it was more than

Now both code works fine

Last edited by johnnybravo; Dec 25, 2012 at 09:19 AM.


Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes

Similar Threads
Thread Thread Starter Forum Replies Last Post
Sidebars don't display properly in IE writesbooks Sidebars & Widgets 1 Sep 15, 2010 10:05 AM
[SOLVED] Favicon doesn't want to appear or doesn't do so properly GrahamW Header configuration & styling 4 Aug 23, 2010 07:49 PM
RSS Feed not working properly adrianneizaguirre RSS, Feeds & Subscribing 1 Mar 19, 2010 05:10 PM
Adsense doesn't show up properly fangfang Sidebars & Widgets 3 Dec 7, 2009 08:03 PM

All times are GMT -6. The time now is 06:20 AM.

Powered by vBulletin® Copyright ©2000 - 2021, Jelsoft Enterprises Ltd.