I had a good time trying to figure it out. I am trying to add a script that needs an external jquerylibrary. I can make it work by inserting my script between the scripts, but I understand that this is not the right way to do this, and it breaks another script on the site.
Today I spent a lot of time trying to figure out how to add the script correctly, and I just can't get it.
I understand that this is the correct way to insert a script into the queue:
function my_scripts_method() {
wp_register_script( 'jquery', 'http://code.jquery.com/jquery-1.9.1.js');
wp_enqueue_script( 'jquery' );
}
add_action('wp_enqueue_scripts', 'my_scripts_method');
My main question is: how can I write my functions so that it calls the library, and at the same time is fault tolerant, so it only loads once and does not crash with other scripts? This is the script:
$(document).ready(function () {
$("#menu-item-16").hover(
function () {
$('body').css("background", "#ff9900");
},
function () {
$('body').css("background", "#ccc");
}
);
$("#menu-item-17").hover(
function () {
$('body').css("background", "red");
},
function () {
$('body').css("background", "#ccc");
}
);
$("#menu-item-18").hover(
function () {
$('body').css("background", "yellow");
},
function () {
$('body').css("background", "#ccc");
}
);
});
Edit:
The second question, several libraries and a style sheet.
, script, , , .
, .
`<link rel="stylesheet" type="text/css" href="/wp-content/themes/neighborhood/js/jquery.fullPage.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js"> </script>
<script type="text/javascript" src="/wp-content/themes/neighborhood/js/vendors/jquery.slimscroll.min.js"></script>
<script type="text/javascript" src="/wp-content/themes/neighborhood/js/jquery.fullPage.js"></script>
<script>
$(document).ready(function() {
$.fn.fullpage({
verticalCentered: true,
resize : true,
slidesColor : ['#AF1700', '#359973', '#F46321', '#A6C7DB'],
scrollingSpeed: 700,
easing: 'easeInQuart',
menu: false,
navigation: false,
navigationPosition: 'right',
navigationTooltips: ['firstSlide', 'secondSlide'],
slidesNavigation: true,
slidesNavPosition: 'bottom',
loopBottom: false,
loopTop: false,
loopHorizontal: true,
autoScrolling: true,
scrollOverflow: true,
css3: false,
paddingTop: '3em',
paddingBottom: '10px',
fixedElements: '#element1, .element2',
normalScrollElements: '#element1, .element2',
keyboardScrolling: true,
touchSensitivity: 15,
continuousVertical: false,
animateAnchor: false,
setScrollingSpeed: 1000,
});
});
</script>
`
, , :
`
function fullpage() { wp_enqueue_script('jquery');
wp_register_style( ’fullpage-css', get_template_directory_uri() . '/js/jquery.fullPage.css','','', 'screen' );
wp_register_script( 'jquery.1.8.3', get_template_directory_uri() . 'http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js', array('jquery'),'',true );
wp_register_script( 'jquery.1.9.1', get_template_directory_uri() . 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.9.1/jquery-ui.min.js', array('jquery'),'',true );
wp_register_script( 'fullpage', get_template_directory_uri() . '/js/jquery.fullPage.js', array('jquery'),'',true );
wp_register_script( 'fullpagecode', get_template_directory_uri() . '/js/fullpagecode.js', array('jquery'),'',true );
wp_register_script( 'slimscroll', get_template_directory_uri() . '/js/vendors/jquery.slimscroll.min.js', '', null,'' );
wp_enqueue_style( 'fullpage-css' );
wp_enqueue_script( 'jquery.1.8.3' );
wp_enqueue_script( 'jquery.1.9.1' );
wp_enqueue_script( 'fullpage' );
wp_enqueue_script( 'fullpagecode' );
wp_enqueue_script( ’slimscroll’ );
}add_action( 'wp_enqueue_scripts', ’fullpage’ ); `