[Javascript] Internet Explorer, iFrames and JavaScript

From: junado at junado.com (Julien Nadeau)
Subject: [Javascript] Internet Explorer, iFrames and JavaScript
Date: Thu Jun 30 13:59:56 2005

Just threw everything together and uploaded it at http:// 
walabi.pingouin.ca/web/ma2/web/index.php

You can try the JavaScript popup by either clicking on any of the 4  
"news" you see on the main page, clicking the "s / h" links on the  
top right corner, or the small wrench next to calendar: all theses  
links should open the popup.

I put a black border on the iFrame to see his size, it obviously  
won't go live like this :)

It is still heavily under development, so the page does looks dumb a  
bit, and empty. It will be fixed.

The user and password required (simple htacces authentification) are
user: javascript
pass: monkey

Thank you!

Julien Nadeau
junado@xxxxxxxxxx

Le 05-06-30 ? 14:41, Falls, Travis D (HTSC, CASD) a ?crit :

> Do you have a public site that we can see this working/not working  
> in?  I tried to get your code to work that you sent and it  
> doesn't... not even in fire fox.  thanks.  :-)
>
> Travis D. Falls | Consultant   RAFT.Net   IT | 860.547.4070 |  
> travis.falls@xxxxxxxxxxxxxxx
>
> -----Original Message-----
> From: javascript-bounces@xxxxxxxxxx [mailto:javascript- 
> bounces@xxxxxxxxxx]On Behalf Of Julien Nadeau
> Sent: Thursday, June 30, 2005 1:13 PM
> To: javascript@xxxxxxxxxx
> Subject: [Javascript] Internet Explorer, iFrames and JavaScript
>
> Hi,
>
> First of all, as I'm new to this list, let me introduce myself. I'm  
> a 20 years old student (studying in mechanical engineering) from  
> Quebec in Canada. I have been doing web programming (mostly html/ 
> css/php/mysql) for the last 3 to 4 years as a hobby, as a freelance  
> and as a part time job. I recently turned to JavaScript for some of  
> my programming needs, which it filled so far, but I'm also learning  
> that, like CSS, JavaScript is extremely browser dependant.
>
> So I have this little script that a friend sent me, which I  
> modified to fit my needs, that create a popup window on my site.  
> The popup itself is a <div> that can be dragged around the page.  
> I'm using a <iframe> in the main popup's <div> in order to display  
> content. Everything is working seemlessly in Safari (v2.0), Firefox  
> (v1.0.4 on my Mac) and Firefox on a PC, but somehow, Internet  
> Explorer 6 refuses to cooperate.
>
> Basically, here's what my HTML code looks like:
>
> <div id="floatingWindow" style="left: -1000px; top: -1000px;">
>     <table border="0" cellspacing="0" cellpadding="0" width="100%">
>     <tr>
>     <td width="100%">
>       <table border="0" width="100%" cellspacing="0"  
> cellpadding="0" height="36">
>       <tr>
>       <td id="floatingTitle" width="100%">
>           <layer width="100%" onSelectStart="return false;">
>               <layer id="floatingTitleText" width="100%"  
> onMouseover="isHot=true;if (isN4) ddN4(theLayer);"  
> onMouseout="isHot=false;">
>                   Title
>                   <a href="#" onClick="hideMe();return false;"> 
> (close)</a>
>               </layer>
>           </layer>
>       </td>
>       </tr>
>       <tr>
>       <td width="100%" bgcolor="#FFFFFF" colspan="1">
>         <iframe id="floatFrame" style="border: 1px solid black;"  
> src=""></iframe>
>       </td>
>       </tr>
>       </table>
>     </td>
>     </tr>
>     </table>
> </div>
>
> This is my floating window, and this code is put right after the  
> <body> tag.
>
> Here's also an example on how I would call the function to show the  
> window:
> <a href="javascript:showMe(200,200,250,250,'http://www.perdu.com/',  
> 'Window title');">show</a>
>
> And finally, here's the JavaScript file that's attached to my HTML  
> page:
>
> /* floatingWindow.js */
>
> isIE=document.all;
> isNN=!document.all&&document.getElementById;
> isN4=document.layers;
> isHot=false;
>
> // outInit is used for module to init the variable whichDog
> // which is needed in order to use the extended window
> function outInit() {
>   whichDog=isIE ? top.document.all.floatingWindow :  
> top.document.getElementById("floatingWindow");
>   whichFTT=isIE ? document.all.floatingTitleText :  
> top.document.getElementById("floatingTitleText");
>   whichFF=isIE ? document.frames("floatFrame") :  
> top.document.getElementById("floatFrame");
>   //whichFTT= top.document.all.floatingTitleText;
>   //whichFF= top.document.all.floatFrame;
> }
>
> function ddInit(e){
>   topDog=isIE ? "BODY" : "HTML";
>   hotDog=isIE ? event.srcElement : e.target;
>   outInit();
>   while (hotDog.id!="floatingTitle"&&hotDog.tagName!=topDog){
>     hotDog=isIE ? hotDog.parentElement : hotDog.parentNode;
>   }
>   if (hotDog.id=="floatingTitle"){
>     offsetx=isIE ? event.clientX : e.clientX;
>     offsety=isIE ? event.clientY : e.clientY;
>     nowX=parseInt(whichDog.style.left);
>     nowY=parseInt(whichDog.style.top);
>     ddEnabled=true;
>     document.onmousemove=dd;
>   }
> }
>
> function dd(e){
>   if (!ddEnabled) return;
>   whichDog.style.left=isIE ? nowX+event.clientX-offsetx + 'px' :  
> nowX+e.clientX-offsetx + 'px';
>   whichDog.style.top=isIE ? nowY+event.clientY-offsety + 'px' : nowY 
> +e.clientY-offsety + 'px';
>   return false;
> }
>
> function ddN4(whatDog){
>   if (!isN4) return;
>   N4=eval(whatDog);
>   N4.captureEvents(Event.MOUSEDOWN|Event.MOUSEUP);
>   N4.onmousedown=function(e){
>     N4.captureEvents(Event.MOUSEMOVE);
>     N4x=e.x;
>     N4y=e.y;
>   }
>   N4.onmousemove=function(e){
>     if (isHot){
>       N4.moveBy(e.x-N4x,e.y-N4y);
>       return false;
>     }
>   }
>   N4.onmouseup=function(){
>     N4.releaseEvents(Event.MOUSEMOVE);
>   }
> }
>
> function hideMe(){
>   if (isIE||isNN) {
>     whichDog.style.visibility="hidden";
>     top.document.getElementById("floatFrame").style.height = 0 + 'px';
>   } else if (isN4) {
>     top.document.floatingWindow.visibility="hide";
>     top.document.floatFrame.style.height = 0 + 'px';
>   }
> }
>
> //               int    int   int      int    str     str
> function showMe(pLeft, pTop, pWidth, pHeight, pUrl, pTitle){
>   if (isIE||isNN) {
>     whichDog.style.visibility="visible";
>     whichDog.style.left = pLeft + 'px';
>     whichDog.style.top = pTop + 'px';
>     whichDog.style.height = pHeight + 'px';
>     whichDog.style.width = pWidth + 'px';
>     whichFTT.innerHTML = pTitle + '\n<a href="#" onClick="hideMe 
> ();return false;">(close)</a>';
>     whichFF.style.height = parseInt(pHeight)-26 + 'px';
>     whichFF.style.width = pWidth + 'px';
>     whichFF.src = pUrl;
>   } else if (isN4) {
>     top.document.floatingWindow.visibility="show";
>     top.document.floatingWindow.left = pLeft + 'px';
>     top.document.floatingWindow.top = pTop + 'px';
>     top.document.floatingWindow.height = pHeight + 'px';
>     top.document.floatingWindow.width = pWidth + 'px';
>     top.document.floatingTitleText.innerHTML = pTitle + '\n<a  
> href="#" onClick="hideMe();return false;">(close)</a>';
>     top.document.floatFrame.height = pHeight-24 + 'px';
>     top.document.floatFrame.width = pWidth + 'px';
>     top.document.floatFrame.src = pUrl;
>   }
> }
>
> document.onmousedown=ddInit;
> document.onmouseup=Function("ddEnabled=false");
>
> /* end floatingWindow.js */
>
> As I said, this code works flawlessly in both Safari and Firefox.
>
> However, when I test it on Internet Explorer 6, when I call the  
> showMe(); function, everything related to whichDog.[anything]  
> works, but everything relating to whichFTT or whichFF fails and  
> stops the script's execution so I get presented with a nicely sized  
> container window, but the title is not altered to what it should be  
> nor is the iframe sized appropriately or given any value for  
> the .src   attribute.
>
> I've been pulling my hairs out for a few days now and I can't seem  
> to figure out what's wrong. Any help would be greatly appreciated!
>
> Thank you very much for taking the time to read through this!
>
> Julien Nadeau
> junado at junado dot com
>
>
>
> ********************************************************************** 
> ***
> PRIVILEGED AND CONFIDENTIAL: This communication, including  
> attachments, is
> for the exclusive use of addressee and may contain proprietary,
> confidential and/or privileged information. If you are not the  
> intended
> recipient, any use, copying, disclosure, dissemination or  
> distribution is
> strictly prohibited. If you are not the intended recipient, please  
> notify
> the sender immediately by return e-mail, delete this communication and
> destroy all copies.
> ********************************************************************** 
> ***
> _______________________________________________
> Javascript mailing list
> Javascript@xxxxxxxxxx
> https://lists.LaTech.edu/mailman/listinfo/javascript
>

-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://lists.LaTech.edu/pipermail/javascript/attachments/20050630/137bf778/attachment.html

Follow-Ups:
- [Javascript] Internet Explorer, iFrames and JavaScript
  - From: Julien Nadeau

References:
- [Javascript] Internet Explorer, iFrames and JavaScript
  - From: Falls, Travis D (HTSC, CASD)

Prev by Date: [Javascript] Internet Explorer, iFrames and JavaScript
Next by Date: [Javascript] A loop for this script?
Previous by thread: [Javascript] Internet Explorer, iFrames and JavaScript
Next by thread: [Javascript] Internet Explorer, iFrames and JavaScript
Index(es):
- Date
- Thread

TechLists.org

Technical Mailing List Archives

Links

Lists

Latest Updates

[Javascript] Internet Explorer, iFrames and JavaScript