jQuery in WordPress Theme Problem ?
-
Hi, I ran into the problem that a jQuery toggle-fade effect is working on a test site of mine but when I insert the codes into my final site then by clicking the toggle link, the page just jumps to the top instead … have checked it back an forth but no luck yet.
Seems that the theme I have on my final site makes a problem. is there a way to identify where the conflict happens and make a little fix around ?This is the code I use :
My toggle.js:
jQuery(document).ready(function(){
//Hide (Collapse) the toggle containers on load
jQuery(“.toggle_container”).hide();
//Switch the “Open” and “Close” state per click then slide up/down (depending on open/close state)
jQuery(“h2.trigger”).click(function(){
jQuery(this).toggleClass(“active”).next().slideToggle(“slow”);
return false; //Prevent the browser jump to the link anchor
});
});
My function.php insert:
/* fh start : jQuery Toggle */
function my_scripts_method() {
// register your script location, dependencies and version
wp_register_script(‘toggle_script’,
get_template_directory_uri() . ‘/js/toggle.js’,
array(‘jquery’),
‘1.0’ );
// enqueue the script
wp_enqueue_script(‘toggle_script’);
}
add_action(‘wp_enqueue_scripts’, ‘my_scripts_method’);
/* fh end : jQuery Toggle */
My HTML:
My test in WordPress:
<h2 class=”trigger”>Toggle Header</h2>
<div class=”toggle_container”>
<div class=”block”>
<h3>Content Header</h3>
Content Content Content lalala
</div>
</div>
My CSS:
h2.trigger a {
display: block;
text-decoration: none;
}Any hint very appreciated.
Regards,
Frank
The topic ‘jQuery in WordPress Theme Problem ?’ is closed to new replies.