www.webdeveloper.com
Results 1 to 6 of 6

Thread: Javascript problem in firefox

  1. #1
    Join Date
    Mar 2009
    Posts
    4

    Javascript problem in firefox

    I am facing one problem in one of my project. It is related to the Firefox



    If you run the attached page in IE it work find and the clicking anchor tag will take you to the bookmark defined (see code)



    But if you run this in Firefox every time you click it the page load in to Iframe (check this after clicking the anchor tag in firfox)



    Is there any way so that in firefox also the page behaves as it work in IE





    Thanks for your help



    Code

    Code:
    <html>
    <head>
    <script language="javascript">
    function LoadHtml()
    	{
    		var objIFrame = document.getElementById("frmEditor");
    		var strHtml = "<a name=\"Article 1\"></a>";
    		strHtml += "<a name=\"Article 2\"></a>";
    		strHtml += "Click Here for <a href="#Article 1\">Article1</a>";
    		strHtml += "Click Here for <a href="#Article 2\">Article2</a>";
    		
    		objIFrame.contentWindow.document.writeln(strHtml);
    		objIFrame.contentWindow.document.close();
    
    	}
    </script>
    </head>
    <body onload="LoadHtml();">
    <iframe height="600" width="600" id="frmEditor"></iframe>
    </body>
    </html>

  2. #2
    Jgy3183 is offline Web Applications Develope
    Join Date
    Mar 2009
    Posts
    29
    this is def a strange one...
    still looking into it, but i have to ask...do you have to use Iframe?
    I was thinking maybe a div or something?

  3. #3
    Join Date
    Mar 2009
    Posts
    4
    yes i have to do that if instead of IFrame it is div there will be no problem

    but here the case is different

    even if you try the thing calling a static page (writing code that is called during body load) it will work but in case live i have it is not working

  4. #4
    Jgy3183 is offline Web Applications Develope
    Join Date
    Mar 2009
    Posts
    29
    Okay, here is what I figured out to do. First of all, yeah, firefox did have some weird issues with those anchors. So I tried to build a function that would "simulate" the jumping by scrolling to the position of the links. This of course requires you handle the <a> tags differently. Adding an onClick handler to a function (look at code below) that will be in the iFrame. Hope it makes sense. Please let me know if you need further clarification. (I added a bunch of junk in the iframe to make sure that the iframe will scroll to the desired anchor)
    See code below:

    Code:
    <html>
    <head>
    <script language="javascript">
    
    function LoadHtml()
    	{
    	
    	var t = document.getElementById("frmEditor");
    	t.s
    	
    	var testFuncStr = "<script language='javascript'>function iFrameJump(obj)";
    	testFuncStr+="{";
    	testFuncStr+="	var goto = obj.getAttribute('href').toString().replace(/\\#/,'');";
    	testFuncStr+="	";
    	
    	testFuncStr+="var elems = document.getElementsByTagName('a');";
    	testFuncStr+="for(var i = 0;i<=elems.length-1;i++)";
    	testFuncStr+="{";
    	testFuncStr+="	if(elems[i].getAttribute('name')==goto)";
    	testFuncStr+="	{ ";
    	testFuncStr+="	 var theY = elems[i].offsetTop;  window.scrollTo(0,theY);";
    	testFuncStr+="			";
    	testFuncStr+="	}";
    	testFuncStr+="}";
    	
    	testFuncStr+="}";
    	
    	testFuncStr+="<\/script>";
    	
    		
    var objIFrame = document.getElementById("frmEditor");
    		
    		
    	var strHtml = "Click Here for <a href='#Article1' onClick='iFrameJump(this);return false'>Article 1</a>";
    		strHtml += "Click Here for <a href='#Article2' onClick='iFrameJump(this);return false'>Article 2</a>";
    		strHtml += "<a name='Article1'></a><p>asfasfdjasdfas<br><BR><BR><BR><BR><BR>asdfasdffds<BR><BR><BR><BR><BR><BR>asdfasdfasdfasdfasdfasdfasfdsadfd<br><BR><BR><BR><BR><BR>asdfasdffds<BR><BR><BR><BR><BR><BR>asdfasdfasdfasdfasdfasdfasfdsadfd<br><BR><BR><BR><BR><BR>asdfasdffds<BR><BR><BR><BR><BR><BR>asdfasdfasdfasdfasdfasdfasfdsadfd<br><BR><BR><BR><BR><BR>asdfasdffds<BR><BR><BR><BR><BR><BR>asdfasdfasdfasdfasdfasdfasfdsadfd<br><BR><BR><BR><BR><BR>asdfasdffds<BR><BR><BR><BR><BR><BR>asdfasdfasdfasdfasdfasdfasfdsadfd<br><BR><BR><BR><BR><BR>asdfasdffds<BR><BR><BR><BR><BR><BR>asdfasdfasdfasdfasdfasdfasfdsadfd<br><BR><BR><BR><BR><BR>asdfasdffds<BR><BR><BR><BR><BR><BR>asdfasdfasdfasdfasdfasdfasfdsadfd<br><BR><BR><BR><BR><BR>asdfasdffds<BR><BR><BR><BR><BR><BR>asdfasdfasdfasdfasdfasdfasfdsadfd<br><BR><BR><BR><BR><BR>asdfasdffds<BR><BR><BR><BR><BR><BR>asdfasdfasdfasdfasdfasdfasfdsadfd<br><BR><BR><BR><BR><BR>asdfasdffds<BR><BR><BR><BR><BR><BR>asdfasdfasdfasdfasdfasdfasfdsadfd<br><BR><BR><BR><BR><BR>asdfasdffds<BR><BR><BR><BR><BR><BR>asdfasdfasdfasdfasdfasdfasfdsadfd<br><BR><BR><BR><BR><BR>asdfasdffds<BR><BR><BR><BR><BR><BR>asdfasdfasdfasdfasdfasdfasfdsadfd<br><BR><BR><BR><BR><BR>asdfasdffds<BR><BR><BR><BR><BR><BR>asdfasdfasdfasdfasdfasdfasfdsadfd<br><BR><BR><BR><BR><BR>asdfasdffds<BR><BR><BR><BR><BR><BR>asdfasdfasdfasdfasdfasdfasfdsadfd<br><BR><BR><BR><BR><BR>asdfasdffds<BR><BR><BR><BR><BR><BR>Rasdfasdfasdfasdfasdfasdfasfdsadfd<br><BR><BR><BR><BR><BR>asdfasdffds<BR><BR><BR><BR><BR><BR>asdfasdfasdfasdfasdfasdfasfdsadfd<br><BR><BR><BR><BR><BR>asdfasdffds<BR><BR><BR><BR><BR><BR>asdfasdfasdfasdfasdfasdfasfdsadfd<br><BR><BR><BR><BR><BR>asdfasdffds<BR><BR><BR><BR><BR><BR>asdfasdfasdfasdfasdfasdfasfdsadfd<br><BR><BR><BR><BR><BR>asdfasdffds<BR><BR><BR><BR><BR><BR>asdfasdfasdfasdfasdfasdfasfdsadfd<br><BR><BR><BR><BR><BR>asdfasdffds<BR><BR><BR><BR><BR><BR>asdfasdfasdfasdfasdfasdfasfdsadfd<br><BR><BR><BR><BR><BR>asdfasdffds<BR><BR><BR><BR><BR><BR>asdfasdfasdfasdfasdfasdfasfdsadfd<br><BR><BR><BR><BR><BR>asdfasdffds<BR><BR><BR><BR><BR><BR>asdfasdfasdfasdfasdfasdfasfdsadfd<br><BR><BR><BR><BR><BR>asdfasdffds<BR><BR><BR><BR><BR><BR>asdfasdfasdfasdfasdfasdfasfdsadfd";
    			//alert(strHtml);
    		strHtml += "<a name='Article2'></a>";
    		strHtml += "Click Here for <a href='#Article1' onClick='iFrameJump(this);return false'>Article 1</a>";
    		strHtml += "Click Here for <a href='#Article2' onClick='iFrameJump(this);return false'>Article 2</a>";
    		
    		strHtml = testFuncStr + strHtml;
    		
    
    		
    		objIFrame.contentWindow.document.writeln(strHtml);
    		objIFrame.contentWindow.document.close();
    
    	}
    </script>
    </head>
    <body onLoad="LoadHtml();">
    <iframe height="600" width="600" id="frmEditor" name="frmEditor"></iframe>
    </body>
    </html>

  5. #5
    Jgy3183 is offline Web Applications Develope
    Join Date
    Mar 2009
    Posts
    29

    ugh

    k, i dont know why it is still putting the lines:

    Code:
    var t = document.getElementById("frmEditor");
    	t.s
    in my other post. i've tried to edit and remove them, but it keeps coming back, so please ignore those lines in my previous post.

    also, if the code gives any problems, let me know.. its a bit tricky becuase the function iFrameJump() has to be generated in a string to append to the HTML for the iFrame.

    hope this makes sense!!

    thanks,
    John

  6. #6
    Join Date
    Mar 2009
    Posts
    4
    Thanks Jgy3183,

    It is really an excellent solution i am able to sort out my problem though it was not working initially in IE but by replacing the current page address i am able to run this in IE also

    so it is a good solution.This will sort out my main problem

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