www.webdeveloper.com
Results 1 to 6 of 6

Thread: Pop ups not working in IE8

  1. #1
    Join Date
    Oct 2011
    Posts
    10

    Pop ups not working in IE8

    Hi guys,

    For some reason, in IE8, on product pages (Example) of my ecommerce site, the 'Size Chart' and 'Email to a Friend' popups don't work, and the product image lightbox won't work either. I have turned pop-up blocker off but they still don't work. These popups work in every other browser I have tested in, including IE7. It seems to only be IE8 that is having this problem.

    Here is the HTML:
    Code:
    <div class="row ">
    
    <label >Size: </label>
    
    <strong class="fl"><select name="size" id="size" onchange="checkstock(this.value)"><option value="">Select Size</option><option value="S">S</option><option value="M">M</option><option value="L">L</option><option value="XL">XL</option><option value="XXL">XXL</option></select></strong> 
    		  
    <span style="text-decoration: underline;" class="size_chart more" title="size_chart1">+ Size Chart</span>
    
    <div style="display: none;" class="size_chart1 hide" > <div class="close"></div>
    
    <img src="http://www.projectdisobey.com/disobeyclothing/wp-content/themes/eCommerce3/images/size_chart.jpg" alt="" />
    					  
    </div>
    
    <!-- size chart -->
    
    </div>
    Code:
    <ul class="fav_link">
         
    <li class="print"> <a href="#" onclick="window.print();return false;">Print</a> </li>
         
    <li class="rss"> <a href="http://feeds.feedburner.com/DisobeyClothing">RSS</a> </li>
         
    <li class="emailtofriend">
         
    <span style="text-decoration: underline;" class="more" title="tellafrnd_div">Email to a Friend</span>
         
    <span id="tellafrnd_success_msg_span"></span>
         
    <div style="display: none;" id="tellfrnddiv" class="tellafrnd_div hide">
         
    <iframe src="http://www.projectdisobey.com/disobeyclothing/?page=tellafriend_form&amp;pid=402" style="border: medium none ; width: 547px; height: 558px;" frameborder="0" ></iframe>
         
    </div>
         
    </li>
         
    <li class="share"> <div class="a2a_kit addtoany_list"> <a class="a2a_dd addtoany_share_save" href="http://www.addtoany.com/share_save"><img src="http://www.projectdisobey.com/disobeyclothing/wp-content/plugins/add-to-any/share_save_171_16.png" width="171" height="16" alt="Share"/> </a> </div>
         
    <script type="text/javascript"><!--
    var a2a_config = a2a_config || {};
    a2a_config.linkname="Know Your Enemy";
    a2a_config.linkurl="http://www.projectdisobey.com/disobeyclothing/?p=402";
    a2a_config.color_main = "f3f3e7";a2a_config.color_border = "C0C88A";a2a_config.color_link_text = "332402";a2a_config.color_link_text_hover = "332402";a2a_config.color_bg = "7f6f2";
         
    a2a_config.num_services = 14;
    //--></script><script type="text/javascript" src="http://static.addtoany.com/menu/page.js"></script>
         
    </li>
         
    </ul>
    Here is the Javascript:
    Code:
    <script type="text/javascript"> var closebutton='<?php bloginfo('template_directory'); ?>/library/js/closebox.png'; </script>
    <script type="text/javascript" src="<?php bloginfo('template_directory'); ?>/library/js/fancyzoom.js"></script>
    
    <script type="text/javascript" charset="utf-8">
    	$(document).ready(function() {
    		$('div.photo a').fancyZoom({scaleImg: true, closeOnClick: true});
    		$('#medium_box_link').fancyZoom({width:400, height:300});
    		$('#large_box_link').fancyZoom();
    		$('#flash_box_link').fancyZoom();
    	});
    </script>
    
    
    <script type="text/javascript">
    /* <![CDATA[ */
    $(document).ready(function(){
    
    $('.hide').hide();
    
    $('body').append('<div id="infoBacking"></div><div id="infoHolder" class="large"></div>');
    $('#infoBacking').css({position:'absolute', left:0, top:0, display:'none', textAlign:'center', background:'', zIndex:'600'});
    $('#infoHolder').css({left:0, top:0, display:'none', textAlign:'center', zIndex:'600', position:'fixed'});
    if($.browser.msie){$('#infoHolder').css({position:'absolute'});}
    
    
    $('.more').mouseover(function() {$(this).css({textDecoration:'none'});} );
    $('.more').mouseout(function() {$(this).css({textDecoration:'none'});} );
    
    $('.more').click(function(){
    
    if ($('.' + $(this).attr("title")).length > 0) {
    
    	browserWindow()
    	getScrollXY()
    
    	if (height<totalY) { height=totalY; }
    
    	$('#infoBacking').css({width: totalX + 'px', height: height + 'px', top:'0px', left:scrOfX + 'px', opacity:0.85});
    	$('#infoHolder').css({width: width + 'px', top:scrOfY + 25 + 'px', left:scrOfX + 'px'});
    	source = $(this).attr("title");
    
    	$('#infoHolder').html('<div id="info">' + $('.' + source).html() + '<p class="clear"><span class="close"><?php _e('Close X');?></span></p></div>');
    
    	$('#infoBacking').css({display:'block'});
    	$('#infoHolder').show();
    	$('#info').fadeIn('slow');
    }
    
    $('.close').click(function(){
    	$('#infoBacking').hide();
    	$('#infoHolder').fadeOut('fast');
    });
    
    });
    
    /* find browser window size */
    function browserWindow () {
    	width = 0
    	height = 0;
    	if (document.documentElement) {
    		width = document.documentElement.offsetWidth;
    		height = document.documentElement.offsetHeight;
    	} else if (window.innerWidth && window.innerHeight) {
    		width = window.innerWidth;
    		height = window.innerHeight;
    	}
    	return [width, height];
    }
    /* find total page height */
    function getScrollXY() {
    	scrOfX = 0; 
    	scrOfY = 0;
    	if( typeof( window.pageYOffset ) == 'number' ) {
    		scrOfY = window.pageYOffset;
    		scrOfX = window.pageXOffset;
    	} else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
    		scrOfY = document.body.scrollTop;
    		scrOfX = document.body.scrollLeft;
    	} else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
    		scrOfY = document.documentElement.scrollTop;
    		scrOfX = document.documentElement.scrollLeft;
    	}
    	totalY = (window.innerHeight != null? window.innerHeight : document.documentElement && document.documentElement.clientHeight ? document.documentElement.clientHeight : document.body != null ? document.body.clientHeight : null);
    
    	totalX = (window.innerWidth != null? window.innerWidth : document.documentElement && document.documentElement.clientWidth ? document.documentElement.clientWidth : document.body != null ? document.body.clientWidth : null);
    	
    	return [ scrOfX, scrOfY, totalY, totalX ];
    }
    
    return false;
    				});
    /* ]]> */
    </script>
    Anybody have any suggestions as to what the problem might be (and how I can rectify it)? If you need more info, please let me know...

    Thanks!

  2. #2
    Join Date
    Jan 2009
    Location
    Insanity
    Posts
    1,131
    Maybe your browsers popup blocker is the issue? You say you have turned it off, have you tried adding them as allowed for that site or domains?

  3. #3
    Join Date
    Oct 2011
    Posts
    10
    Quote Originally Posted by JunkMale View Post
    Maybe your browsers popup blocker is the issue? You say you have turned it off, have you tried adding them as allowed for that site or domains?
    Thanks! This seems to be what the problem was. I can't believe I didn't try this before!

  4. #4
    Join Date
    Jan 2009
    Location
    Insanity
    Posts
    1,131
    Sometimes it takes more than one set of eyes to see.

  5. #5
    Join Date
    Oct 2011
    Posts
    12
    I have the same problem. But what about your customers who don't know to turn off the pop up blocker? If the page doesn't load for them, they leave. That's the problem I'm trying to fix, is to get an overall method that works for the average web searcher so they don't have to tweak the browser. In any event, I still haven't figured it out yet. I can make the javascript work making popup windows of images no problem, but not with html pages.

  6. #6
    Join Date
    Jan 2009
    Location
    Insanity
    Posts
    1,131
    Usually the "Popup blocker" will alert the user that a pop up was suppressed and if they want to open it.
    We all have baggage to carry in life, unfortunately for me I always get the trolley with the wonky wheel...
    Code:
    Youre = {
          STILL_not_getting_it:function(){
               alert("YOU, the original poster / thread starter NEED to POST the code and NOT a LINK.");
          },
          MissingThePoint:function(msg){
                alert("You're missing the point. " + msg);
          }
    }
    Youre.STILL_not_getting_it();

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles