Links

Lists

Latest Updates

Ruby On Rails List
Python list
Advanced Java
The JavaScript List
Apache Users
Full Disclosure
Linux Security

Search the archives!
Having a development problem? Ask eDevelopment.org forums!

[Date Prev][Date Next][Thread Prev][Thread Next][Date Index][Thread Index]

[Javascript] Internet Explorer, iFrames and JavaScript

  • From: junado at junado.com (Julien Nadeau)
  • Subject: [Javascript] Internet Explorer, iFrames and JavaScript
  • Date: Thu Jun 30 18:38:46 2005
Thanks to whoever took a look at my problem, I finally found the  
solution.

It appears that Internet Explorer does *not* recognize the .innerHTML  
value for a <layer> tag, so I just changed the <layer> tag to a <div>  
tag and it solved my problem.

I knew I should have tried it earlier, but I just forgot about it  
while looking for a solution. Shame on me :)

Julien Nadeau
junado@xxxxxxxxxx

Le 05-06-30 ? 14:59, Julien Nadeau a ?crit :

> 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
>>
>
> _______________________________________________
> 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/76bfec92/attachment-0001.html