Conflict with jQuery

Viewing 9 replies - 1 through 9 (of 9 total)
  • Thread Starter Blazzer

    (@blazzer)

    10 years, 3 months ago

    How can i use multiple javascript files on my website?

    Thread Starter Blazzer

    (@blazzer)

    10 years, 3 months ago

    this is the code from the header 

    <!DOCTYPE html>
<html <?php language_attributes(); ?>><head>
<meta charset="utf-8" />
<link rel="stylesheet" href="<?php echo get_stylesheet_directory_uri(); ?>/css/reset.css" />
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" />
<link rel="stylesheet" href="<?php echo get_stylesheet_directory_uri(); ?>/css/typography.css" />
<link rel="stylesheet" href="<?php echo get_stylesheet_directory_uri(); ?>/css/nivo-slider.css" type="text/css" media="screen" />
<link rel="stylesheet" href="<?php echo get_stylesheet_directory_uri(); ?>/css/jquery.fancybox-1.3.4.css" />
<link rel="alternate" type="application/rss+xml" title="<?php bloginfo('name'); ?> RSS Feed" href="<?php bloginfo('rss2_url'); ?>" />
<link rel="alternate" type="application/atom+xml" title="<?php bloginfo('name'); ?> Atom Feed" href="<?php bloginfo('atom_url'); ?>" />
<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
<!--[if IE]>
<link rel="stylesheet" href="<?php echo get_stylesheet_directory_uri(); ?>/css/ie_style.css" />
<![endif]-->
<!--<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>-->

<script type="text/javascript" src="<?php echo get_stylesheet_directory_uri(); ?>/js/jquery.min.js"></script>
<script type="text/javascript" src="<?php echo get_stylesheet_directory_uri(); ?>/js/jquery.backgroundPosition.js"></script>
<script type="text/javascript" src="<?php echo get_stylesheet_directory_uri(); ?>/js/script.js"></script>
<script type="text/javascript" src="<?php echo get_stylesheet_directory_uri(); ?>/js/jquery.nivo.slider.pack.js"></script>
<script type="text/javascript" src="<?php echo get_stylesheet_directory_uri(); ?>/js/fGallery.jquery.js"></script>
<script type="text/javascript" src="<?php echo get_stylesheet_directory_uri(); ?>/js/highlightRegex.js"></script>
<script type="text/javascript" src="<?php echo get_stylesheet_directory_uri(); ?>/js/jquery.fancybox-1.3.4.pack.js"></script>

<?php
	if(get_option('css_file_url') != ''){ ?>
		<link rel="stylesheet" href="<?php echo get_option('css_file_url'); ?>" />
	<?php }
?>

<?php include get_stylesheet_directory() . '/css/color-style.php'; ?>
<?php include get_stylesheet_directory() . '/js/nivo-settings.php'; ?>
<style type="text/css">
<?php
	echo get_option('additional_style');
?>
</style>
<title><?php wp_title('&laquo;', true, 'right'); ?> <?php bloginfo('name'); ?></title>

<?php wp_head(); ?>
<?php
if(get_option('google_analytics') && get_option('google_analytics') != '')
{
	echo get_option('google_analytics');
}
?>

</head>
<body <?php get_body_class(); ?>>
<div id="header">
  <div id="header_container"> 

  <?php
	if( get_option('logo_url') && get_option('logo_url') != '' )
	{?>
		<img class="logo" src="<?php echo get_option('logo_url'); ?>" alt="Logo" />
<?php }
  ?>
    <div id="nav_container">
        <?php 

		if ( has_nav_menu('main-menu') )
		{
			wp_nav_menu(
				array(
					'menu_class' => 'nav',
					'container' => '',
					'menu_id'=> 'nav',
					'theme_location' =>
					'main-menu', 'fallback_cb' =>
					'_do_use_menu',
					'walker' => new notIndex_Walker
				)
			);
		}else{
			echo '<ul class="nav" id="nav"><li>Navigation menu is not defined yet. Go to Appearance -> <a style="text-decoration: underline;" href="'. home_url('/') .'wp-admin/nav-menus.php" title="Navigation Menues">Menus</a> to select or create one.</il></ul>';
		}
		?>
      <!--end nav-->
	  <?php if( get_option('use_live_search_checkbox') == 'on' ) {?>
		  <div id="live_search">
			<input type="text" id="search" value="Live Search">
			<div id="next"> </div>
			<!--end next-->
		  </div>
      <!--end live_search-->
	 <?php } ?>
    </div>
    <!--end nav_container-->
    <div id="social_container">
      <div class="social_holder">
        <ul id="social_icons">

		<?php
		if(get_option('social_icons_list')){
			foreach(get_option('social_icons_list') as $icon){ ?>
				<li><a href="<?php echo $icon[0]; ?>"><img src="<?php echo $icon[1]; ?>" alt="Social Icon"/></a></li>
			<?php
			}
		}?>
        </ul>

        <!--end social_icons-->
        <div class="opacity"> </div>
        <!--end opacity-->
      </div>
      <!--end social_holder-->
    </div>
    <!--end social_container-->
  </div>
  <!--end header_container-->
</div>
<!--end header-->
    Rolf Allard van Hagen

    (@ravanh)

    10 years, 3 months ago

    Hi Blazzer, I think the link to your site got lost… In any case your theme is loading it’s own jQuery library: /js/jquery.min.js

    This is porbably a version pre 1.9 which would indeed be incompatible the latest version of Easy FancyBox. You can either revert to an older version of Easy FancyBox (try 1.3.4.9 from http://wordpress.org/plugins/easy-fancybox/developers/) or upgrade the jQuery library in your theme to a newer version (1.9 or 1.10)…

    Thread Starter Blazzer

    (@blazzer)

    10 years, 3 months ago

    Hi Ravanh,

    I try to install the older version but dont work.
    Now i updated the jQuery but still no luck :s

    <!DOCTYPE html>
<html <?php language_attributes(); ?>><head>
<meta charset="utf-8" />
<link rel="stylesheet" href="<?php echo get_stylesheet_directory_uri(); ?>/css/reset.css" />
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" />
<link rel="stylesheet" href="<?php echo get_stylesheet_directory_uri(); ?>/css/typography.css" />
<link rel="stylesheet" href="<?php echo get_stylesheet_directory_uri(); ?>/css/nivo-slider.css" type="text/css" media="screen" />
<link rel="stylesheet" href="<?php echo get_stylesheet_directory_uri(); ?>/css/jquery.fancybox-1.3.4.css" />
<link rel="alternate" type="application/rss+xml" title="<?php bloginfo('name'); ?> RSS Feed" href="<?php bloginfo('rss2_url'); ?>" />
<link rel="alternate" type="application/atom+xml" title="<?php bloginfo('name'); ?> Atom Feed" href="<?php bloginfo('atom_url'); ?>" />
<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
<!--[if IE]>
<link rel="stylesheet" href="<?php echo get_stylesheet_directory_uri(); ?>/css/ie_style.css" />
<![endif]-->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>-->

<script type="text/javascript" src="<?php echo get_stylesheet_directory_uri(); ?>/js/jquery.min.js"></script>
<script type="text/javascript" src="<?php echo get_stylesheet_directory_uri(); ?>/js/jquery.backgroundPosition.js"></script>
<script type="text/javascript" src="<?php echo get_stylesheet_directory_uri(); ?>/js/script.js"></script>
<script type="text/javascript" src="<?php echo get_stylesheet_directory_uri(); ?>/js/jquery.nivo.slider.pack.js"></script>
<script type="text/javascript" src="<?php echo get_stylesheet_directory_uri(); ?>/js/fGallery.jquery.js"></script>
<script type="text/javascript" src="<?php echo get_stylesheet_directory_uri(); ?>/js/highlightRegex.js"></script>
<script type="text/javascript" src="<?php echo get_stylesheet_directory_uri(); ?>/js/jquery.fancybox-1.3.4.pack.js"></script>

<?php
	if(get_option('css_file_url') != ''){ ?>
		<link rel="stylesheet" href="<?php echo get_option('css_file_url'); ?>" />
	<?php }
?>

<?php include get_stylesheet_directory() . '/css/color-style.php'; ?>
<?php include get_stylesheet_directory() . '/js/nivo-settings.php'; ?>
<style type="text/css">
<?php
	echo get_option('additional_style');
?>
</style>
<title><?php wp_title('&laquo;', true, 'right'); ?> <?php bloginfo('name'); ?></title>

<?php wp_head(); ?>
<?php
if(get_option('google_analytics') && get_option('google_analytics') != '')
{
	echo get_option('google_analytics');
}
?>

</head>
<body <?php get_body_class(); ?>>
<div id="header">
  <div id="header_container"> 

  <?php
	if( get_option('logo_url') && get_option('logo_url') != '' )
	{?>
		<img class="logo" src="<?php echo get_option('logo_url'); ?>" alt="Logo" />
<?php }
  ?>
    <div id="nav_container">
        <?php 

		if ( has_nav_menu('main-menu') )
		{
			wp_nav_menu(
				array(
					'menu_class' => 'nav',
					'container' => '',
					'menu_id'=> 'nav',
					'theme_location' =>
					'main-menu', 'fallback_cb' =>
					'_do_use_menu',
					'walker' => new notIndex_Walker
				)
			);
		}else{
			echo '<ul class="nav" id="nav"><li>Navigation menu is not defined yet. Go to Appearance -> <a style="text-decoration: underline;" href="'. home_url('/') .'wp-admin/nav-menus.php" title="Navigation Menues">Menus</a> to select or create one.</il></ul>';
		}
		?>
      <!--end nav-->
	  <?php if( get_option('use_live_search_checkbox') == 'on' ) {?>
		  <div id="live_search">
			<input type="text" id="search" value="Live Search">
			<div id="next"> </div>
			<!--end next-->
		  </div>
      <!--end live_search-->
	 <?php } ?>
    </div>
    <!--end nav_container-->
    <div id="social_container">
      <div class="social_holder">
        <ul id="social_icons">

		<?php
		if(get_option('social_icons_list')){
			foreach(get_option('social_icons_list') as $icon){ ?>
				<li><a href="<?php echo $icon[0]; ?>"><img src="<?php echo $icon[1]; ?>" alt="Social Icon"/></a></li>
			<?php
			}
		}?>
        </ul>

        <!--end social_icons-->
        <div class="opacity"> </div>
        <!--end opacity-->
      </div>
      <!--end social_holder-->
    </div>
    <!--end social_container-->
  </div>
  <!--end header_container-->
</div>
<!--end header-->
    Thread Starter Blazzer

    (@blazzer)

    10 years, 3 months ago

    gototheflow.nl is my url

    Rolf Allard van Hagen

    (@ravanh)

    10 years, 3 months ago

    I’m afraid the Nivo Slider in your theme requires jQuery 1.6 while the later included WordPress jQuery library is 1.10. It causes an Uncaught Exception error.

    To solve this you will need a lot of time going through all theme scripts making them compatible with jQuery 1.10 in noConflict mode. Maybe best to try another lightbox plugin…

    Thread Starter Blazzer

    (@blazzer)

    10 years, 3 months ago

    It works now but my animated scroll dont work :s

    I only change the line <script type=”text/javascript” src=”<?php echo get_stylesheet_directory_uri(); ?>/js/jquery.fancybox-1.3.4.pack.js”></script> and move it above the other lines. 

    <!--[if IE]>
<link rel="stylesheet" href="<?php echo get_stylesheet_directory_uri(); ?>/css/ie_style.css" />
<![endif]-->
<!--<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>-->

<script type="text/javascript" src="<?php echo get_stylesheet_directory_uri(); ?>/js/jquery.fancybox-1.3.4.pack.js"></script>
<script type="text/javascript" src="<?php echo get_stylesheet_directory_uri(); ?>/js/jquery.min.js"></script>
<script type="text/javascript" src="<?php echo get_stylesheet_directory_uri(); ?>/js/jquery.backgroundPosition.js"></script>
<script type="text/javascript" src="<?php echo get_stylesheet_directory_uri(); ?>/js/script.js"></script>
<script type="text/javascript" src="<?php echo get_stylesheet_directory_uri(); ?>/js/jquery.nivo.slider.pack.js"></script>
<script type="text/javascript" src="<?php echo get_stylesheet_directory_uri(); ?>/js/fGallery.jquery.js"></script>
<script type="text/javascript" src="<?php echo get_stylesheet_directory_uri(); ?>/js/highlightRegex.js"></script>
    Rolf Allard van Hagen

    (@ravanh)

    10 years, 3 months ago

    Wow, I was so focused on the jQuery library that is included 3 times that I forgot to check for multiple instances of the fancybox script. It is indeed alread included in your theme which makes it completely incompatible with my plugin. You need to deactivate Easy FancyBox and use the FancyBox script that is already there.

    Thread Starter Blazzer

    (@blazzer)

    10 years, 3 months ago

    Ok thanks for you help! i think i need to hire someone to fix this…

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘Conflict with jQuery’ is closed to new replies.