Conflict with an external script

  • I have a script like:

    pagination.js

    var busy = false;
jQuery(window).scroll(function () {
    if (jQuery(window).scrollTop() > 300) {
        jQuery('#scrollUp').stop().animate({
            opacity: 0.05
        }, 400)
    } else {
        jQuery('#scrollUp').stop().animate({
            opacity: 0.00
        }, 400)
    }
    if (jQuery(window).scrollTop() + jQuery(window).height() > jQuery('#main_content').offset().top + jQuery('#main_content').height() - 50 && !busy) {
        busy = true;
        link = jQuery('.pagination .nextpage').attr('href');
        if (typeof link != 'undefined') {
            var params = 'smt_layout=' + jQuery('body').attr('layout') + '&ajaxpage=1';
            jQuery.ajax({
                type: "POST",
                cache: false,
                async: false,
                data: params,
                url: link,
                dataType: 'json',
                success: function (data) {
                    if (data != "") {
                        jQuery('.pagination .nextpage').parent().append('<span class="thispage">Page ' + jQuery('.pagination .nextpage').attr('alt') + '</span>');
                        jQuery('.pagination .nextpage').remove();
                        jQuery("#main_content").append(data['content']);
                        busy = false
                    }
                }
            })
        }
    }
});
jQuery('#scrollUp').live('mouseenter', function () {
    jQuery(this).stop().animate({
        opacity: 0.1
    }, "slow")
}).live('mouseout', function () {
    if (jQuery(window).scrollTop() > 300) var o = 0.05;
    else var o = 0.00;
    jQuery(this).stop().animate({
        opacity: o
    }, "slow")
});
jQuery('#scrollUp').live('click', function () {
    jQuery('html, body').animate({
        scrollTop: 0
    }, 1200);
});

    I’m using a Magnific Popup on Photonic Gallery Plugin:

    magnific.js

    and I get an error (Google Chrome Console): Uncaught TypeError: Cannot read property ‘top’ of undefined at pagination.js

    It seems that the script is failing on this: jQuery(‘#main_content’).offset().top. Is there a way to resolve this problem? Thank you in advance.

Viewing 7 replies - 1 through 7 (of 7 total)
  • Plugin Author Sayontan Sinha

    (@sayontan)

    Hi,
    Does this error go away if you disable Photonic? I ask because it doesn’t seem to me that there is any code in Photonic that would conflict with this, unless there is a specific sequence of loading scripts required by it (Photonic uses the default sequence where scripts are loaded in the beginning).

    Does this plugin replace WP’s pagination with JS?

    Thread Starter lukaszj94

    (@lukaszj94)

    Hi,

    Thank you very much for your reply.

    If I disable Photonic the error goes away. The script allows scrolling a page to the top. That’s the function in which the script is implemented: 

    function headtext() {
			if(
				(is_archive()&&is_day()&&$this->get( 'seo', 'day' ))||
				(is_archive()&&is_month()&&$this->get( 'seo', 'month' ))||
				(is_archive()&&is_year()&&$this->get( 'seo', 'year' ))||
				(is_category()&&$this->get( 'seo', 'category' ))||
				(is_tag()&&$this->get( 'seo', 'tag' ))||
				(is_author()&&$this->get( 'seo', 'author' ))||
				(is_search()&&$this->get( 'seo', 'search' ))
			) {
				?><meta name="robots" content="noindex" /><?php
			}
			if ($this->get( 'general', 'favicon' )) 
				echo '<link rel="shortcut icon" href="' . $this->get( 'general', 'favicon' ) . '" type="image/x-icon" />' . "\n";
			if ($this->get( 'integration', 'rss' )) {
				echo '<link rel="alternate" type="application/rss+xml" title="RSS Feed" href="' . $this->get( 'integration', 'rss' ) . '" />' . "\n";
			}
			
			if ($this->get( 'layout', 'pagination' )) { ?>
					<script type="text/javascript" src="<?php echo get_template_directory_uri()?>/js/pagination.js"></script>
			<?php } ?>
			
				<link rel="stylesheet" href="<?php echo get_template_directory_uri()?>/css/wide.css" type="text/css" media="screen and (min-width:1024px)" />
				<!--[if lt IE 9]>
				<link rel="stylesheet" href="<?php echo get_template_directory_uri()?>/css/wide.css" type="text/css" media="screen" />
				<link rel="stylesheet" href="<?php echo get_template_directory_uri()?>/css/ie.css" type="text/css" media="screen" />
				<![endif]-->
				<link rel="stylesheet" href="<?php echo get_template_directory_uri()?>/css/mobile.css" type="text/css" media="screen and (min-width:240px) and (max-width:639px)" />
				<link rel="stylesheet" href="<?php echo get_template_directory_uri()?>/css/tablet.css" type="text/css" media="screen and (min-width:640px) and (max-width:1023px)" />
				<?php if ($this->get( 'integration', 'ecwidcss' )) { ?>
					<link rel="stylesheet" href="<?php echo get_template_directory_uri()?>/css/ecwid.css" type="text/css"  />
				<?php } ?>
				<link rel="stylesheet" href="<?php echo get_template_directory_uri()?>/css/shortcode.css" type="text/css" media="screen, projection" />
				<script src="<?php echo get_template_directory_uri()?>/js/jquery.cycle.all.js" type="text/javascript"></script>
			<?php
			if ( is_singular() ) wp_enqueue_script( 'comment-reply' );
			?>
			<script type="text/javascript">
				jQuery(document).ready(function() {

					<?php
						$this->block_slider_config();
					?>
					jQuery(".menus .children").addClass('sub-menu');
					<?php
						$this->block_menu_config("menus");
					?>
					jQuery('textarea[name="comment"]').each(function(){
						jQuery(this).attr('name','<?php echo $_SESSION['commentinput']; ?>');
					});
					
				});
			</script>
			<?php
		}
    Plugin Author Sayontan Sinha

    (@sayontan)

    Can you provide me with a URL?

    Thread Starter lukaszj94

    (@lukaszj94)

    Here is a URL: Link

    The “scroll to the top” button which uses the pagination.js script is on the right side.

    Plugin Author Sayontan Sinha

    (@sayontan)

    Hi,
    I took a look at the URL you have above, and it seems to be working fine. I don’t get an error or conflict, and when I click on the “arrow” I get taken to the top of the page.

    I tried this with Google Chrome version 71.0.3578.98.

    Plugin Author Sayontan Sinha

    (@sayontan)

    Hello,
    Following up on this – are you still seeing an issue? On the link you provided the scrolling behaviour seems to be working fine.

    Thread Starter lukaszj94

    (@lukaszj94)

    I still get the error: Link

    It’s really strange because the console doesn’t always display it.
    But as I told before when I disable Photonic I have not noticed this error once.

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Conflict with an external script’ is closed to new replies.