Two Scripts clashing, Help!

JavaScript
1

Hello All,

Thanks for your interest in helping me solve this issue. I don’t have a solid amount of experience solving issues in Javascript as I am more of a UI and Web Designer. Can someone help me solve this issue: I use the prototype.js (v1.7) script and the small script below… When both included in the page, they both don’t play together nicely.

Here’s the second script that’s clashing with prototype.js:

<script type=“text/javascript”>
function moveScroller() {
var a = function() {
var b = $(window).scrollTop();
var d = $(“#scroller-anchor”).offset({scroll:false}).top;
var c=$(“#scroller”);
if (b>d) {
c.css({position:“fixed”,top:“0px”})
} else {
if (b<=d) {
c.css({position:“relative”,top:“”})
}
}
};
$(window).scroll(a);a()
}
</script>

2

So what exactly is the issue you’re having with it? Is it somewhere live we can see it?

3

Since it’s for the company I work for, it’s local at this time but I can upload the prototype.js script if you’d like?

also this is what the header looks like:

<head>
<meta http-equiv=“Content-Type” content=“<?php bloginfo(‘html_type’); ?>; charset=<?php bloginfo(‘charset’); ?>” />

<title>
<?php if ( is_home()) { bloginfo(‘name’); ?> - <?php bloginfo(‘description’); } ?>
<?php if ( is_search()) { bloginfo(‘name’); ?> - <?php _e(‘Search Results’, ‘nattywp’); } ?>
<?php if ( is_author()) { bloginfo(‘name’); ?> - <?php _e(‘Author Archives’, ‘nattywp’); } ?>
<?php if ( is_single()) { $custom_title = get_post_meta($post->ID, ‘natty_title’, true);
if (strlen($custom_title)) {echo strip_tags(stripslashes($custom_title));}else { wp_title(‘’); ?> - <?php bloginfo(‘name’); }} ?>
<?php if ( is_page()) { $custom_title = get_post_meta($post->ID, ‘natty_title’, true);
if (strlen($custom_title)) {echo strip_tags(stripslashes($custom_title));}else { bloginfo(‘name’); ?> - <?php wp_title(‘’); }}?>
<?php if ( is_category()) { bloginfo(‘name’); ?> - <?php _e(‘Archive’,‘nattywp’); ?> - <?php single_cat_title(); } ?>
<?php if ( is_month()) { bloginfo(‘name’); ?> - <?php _e(‘Archive’,‘nattywp’); ?> - <?php the_time(‘F’); } ?>
<?php if (function_exists(‘is_tag’)) { if ( is_tag() ) { bloginfo(‘name’); ?> - <?php _e(‘Tag Archive’,‘nattywp’); ?> - <?php single_tag_title(“”, true); } } ?>
</title>

<?php /* Include the jQuery framework */
wp_enqueue_script(“jquery”); if (is_singular() && get_option(‘thread_comments’)) wp_enqueue_script( ‘comment-reply’ ); ?>

<?php wp_head(); ?>

<!-- Feed link –>
<link rel=“alternate” type=“application/rss+xml” title=“<?php bloginfo(‘name’); ?> RSS Feed” href=“<?php bloginfo(‘rss2_url’); ?>” />
<link rel=“pingback” href=“<?php bloginfo(‘pingback_url’); ?>” />

<!-- jQuery utilities –>
<script type=“text/javascript”>var themePath = ‘<?php echo get_template_directory_uri(); ?>/’; // for js functions </script>
<script type=‘text/javascript’ src=‘<?php echo get_template_directory_uri(); ?>/js/superfish.js?ver=2.9.2’></script>
<?php if (t_get_option(‘t_cufon_replace’) == ‘yes’) { ?>
<script type=“text/javascript” src=“<?php echo get_template_directory_uri(); ?>/js/cufon.js”></script>
<script type=“text/javascript” src=“<?php echo get_template_directory_uri(); ?>/js/font.js”></script>
<script type=“text/javascript”>Cufon.replace(‘.post .news-case h2 a, .timeblock span, h3, h2, span.fad, #top_nav li a’, {hover:true});
Cufon.replace(‘h2.title, .client-reviews h2’,{hover: true, fontWeight: 700});
</script>
<?php } ?>

<!-- Style sheets –>
<link rel=“stylesheet” type=“text/css” href=“<?php bloginfo(‘stylesheet_url’); ?>” media=“screen” />

<link href=‘http://fonts.googleapis.com/css?family=Carme’ rel=‘stylesheet’ type=‘text/css’>

<script type=“text/javascript” src=“http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js”></script>

&lt;link rel="stylesheet" href="&lt;?php echo get_template_directory_uri(); ?&gt;/css/lightbox.css" type="text/css" media="screen" /&gt;
&lt;script src="&lt;?php echo get_template_directory_uri(); ?&gt;/js/prototype.js" type="text/javascript"&gt;&lt;/script&gt;
&lt;script src="&lt;?php echo get_template_directory_uri(); ?&gt;/js/scriptaculous.js?load=effects,builder" type="text/javascript"&gt;&lt;/script&gt;
&lt;script src="&lt;?php echo get_template_directory_uri(); ?&gt;/js/lightbox.js" type="text/javascript"&gt;&lt;/script&gt;

<script type=“text/javascript”>
function moveScroller() {
var a = function() {
var b = $(window).scrollTop();
var d = $(“#scroller-anchor”).offset({scroll:false}).top;
var c=$(“#scroller”);
if (b>d) {
c.css({position:“fixed”,top:“0px”})
} else {
if (b<=d) {
c.css({position:“relative”,top:“”})
}
}
};
$(window).scroll(a);a()
}
</script>
</head>

4

Wow - that’s a lot of scripting there. jQuery AND prototype AND scriptaculous and a lightbox. Are you sure it’s the prototype it’s barking at?

Just a bit of advice for your own sanity’s sake - you might want to look at seeing what you can sort out from all those javascript frameworks. There’s a lot of cross functionality which probably isn’t needed, so if you can find one that has the functionality you want, you should probably consider simplifying.

I know jQuery has plugins which at least covers the lightbox…

5

Haha, thanks Dave… I will definitely look into minimizing the resources for the site.