SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Addict piku's Avatar
    Join Date
    Oct 2003
    Location
    Alameda, CA
    Posts
    239
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question IE6 onclick option-tag shortcoming, and unobtrusive solutions(?)

    So, I was trying to take these elements to unobtrusiveness and extendability:

    * Select box navigation
    * and a simple popup-window via an onclick event

    I got these to work on FF but not IE6, http://test.pixelbebop.com/test26/.

    For the select-box nav, I recall that "onclick" won't work on the option-tags (for reference to those that need remembering), so I prompted to do getElementsByTagName("select") vs "option", and use the "onchange" event on it.

    For the popup-window, IE6 doesn't even load the popup but manages to change the current browser window to the link that I wanted to load in the popup-window in the first place.

    With that, I'm just wondering if there is any other things I'm missing, or subjects/topics I should be aware of, in getting these to work in all/most the major browser starting w/ IE6? Pointers, hints, suggestions are greatly appreciated.

    Thanks in advance,
    Sherwin


    PS. Here's the source I have in the link above just in case the server is down:

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    	<head>
    			<script type="text/javascript" src="scripts/common.js"></script><!-- via Dustin Diaz -->
    			<script type="text/javascript" language="javascript">
    				// NOTE: This doesn't work in IE6
    				function popContent() {
    					//alert('popContent() invoked');
    					var content = document.getElementsByTagName("a");
    					for (var i=0; i<content.length; i++) {
    						if (content[i].getAttribute("class") == "pop-content") {
    							content[i].onclick = function() {
    								var popUpWin=0;
    								function popUpWindow(URLStr, left, top, width, height) {
    									if(popUpWin) {
    										if(!popUpWin.closed) popUpWin.close();
    									}
    									popUpWin = open(URLStr, 'popUpWin', 'toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=yes,resizable=yes,copyhistory=yes,width='+width+',height='+height+',left='+left+', top='+top+',screenX='+left+',screenY='+top+'');
    									return false;
    								}
    							
    								popUpWindow(this.href, 440, 312, 400, 400);
    								return false;
    							}
    						}
    					}
    				}
    				function switchPage() {
    					var selectOptions = document.getElementsByTagName("select");
    					for (var i=0; i<selectOptions.length; i++) {
    						if (selectOptions[i].getAttribute("class") == "switch-page") {
    							// NOTE: This doesn't work in IE6
    							selectOptions[i].onchange = function() {
    								location.href = this.value;
    								return false;
    							}
    						}
    					}
    				}
    				addLoadEvent(switchPage);
    				addLoadEvent(popContent);
    				
    				/*
    				// This works
    				addLoadEvent(function() {
    					$('select-category').onchange = function() {
    						window.location = this.value;
    						return false;
    					}
    				})
    				addLoadEvent(function() {
    					$('cta-help-see-video').onclick = function() {
    						var popUpWin=0;
    						function popUpWindow(URLStr, left, top, width, height) {
    							if(popUpWin) {
    								if(!popUpWin.closed) popUpWin.close();
    							}
    							popUpWin = open(URLStr, 'popUpWin', 'toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=yes,resizable=yes,copyhistory=yes,width='+width+',height='+height+',left='+left+', top='+top+',screenX='+left+',screenY='+top+'');
    							return false;
    						}
    				
    						popUpWindow(this.href, 440, 312, 400, 400);
    						return false;
    					}
    				})
    				*/
    			</script>
    	</head>
    
    	<body>
    		<p><a href="http://www.google.com/" id="cta-help-see-video" class="pop-content">Can&rsquo;t see this video?</a></p>
    	
    		<select id="select-category" class="switch-page">
    			<option value="?cat=1" selected="selected">All Categories</option>
    			<option value="?cat=2">Military Humor</option>
    			<option value="?cat=3">Tributes</option>
    			<option value="?cat=4">Hardware</option>
    			<option value="?cat=5">Air Power</option>
    			<option value="?cat=6">Land Power</option>
    			<option value="?cat=7">Sea Power</option>
    			<option value="?cat=8">Gun Battles</option>
    			<option value="?cat=9">Explosions</option>
    		</select>
    	</body>
    </html>

  2. #2
    SitePoint Wizard gRoberts's Avatar
    Join Date
    Oct 2004
    Location
    Birtley, UK
    Posts
    2,439
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    is there a reason why your not simply using the onChange event?


  3. #3
    SitePoint Addict piku's Avatar
    Join Date
    Oct 2003
    Location
    Alameda, CA
    Posts
    239
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by gRoberts View Post
    is there a reason why your not simply using the onChange event?
    I'm currently using that...

    Code:
    addLoadEvent(function() {
    	// This works for IE6
    	$('select-category').onchange = function() {
    		window.location = this.value;
    		return false;
    	}
    })
    However, I'm trying to see if this can be more extendable for future use when, let's say, you have more than one select-box. I guess there's different things to take away from this, but one of the issues that I'm trying to find if its even fixable or understand is why my other implementation don't work in IE6(?). With these as particulars...

    Code:
    content[i].onclick = function()...
    
    and
    
    selectOptions[i].onchange = function()...
    ?

  4. #4
    SitePoint Wizard gRoberts's Avatar
    Join Date
    Oct 2004
    Location
    Birtley, UK
    Posts
    2,439
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    my honest opinion, although it may not be true, is that if it works in IE and not anything else, then its wrong (without stating the obvious).


  5. #5
    SitePoint Addict piku's Avatar
    Join Date
    Oct 2003
    Location
    Alameda, CA
    Posts
    239
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by gRoberts View Post
    my honest opinion, although it may not be true, is that if it works in IE and not anything else, then its wrong (without stating the obvious).
    I don't follow the reference to the thread--but I do agree with you haha =)


Bookmarks

Posting Permissions

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