HTML

css float formating with javascript versus IE

Posted by dragos on July 31, 2007
HTML / 1 Comment

If you ever, by any chance try to format some HTML elements with javascript, and that formating would refer to float propertries, please be aware. Let me give you the most simple example I’ve met:

<p id="a1">a</p>
<p id="a2">a</p>
<p id="a3">a</p>
document.getElementById('a1').style.width='100px';  
document.getElementById('a2').style.width='100px';  
document.getElementById('a3').style.width='100px';  
document.getElementById('a1').style.backgroundColor = '#FF0000';    
document.getElementById('a2').style.backgroundColor = '#FF0000';    
document.getElementById('a3').style.backgroundColor = '#FF0000';    
document.getElementById('a1').style.cssFloat= 'left';    
document.getElementById('a2').style.cssFloat= 'left';    
document.getElementById('a3').style.cssFloat= 'left';

All the browsers will interpret it well, EXCEPT IE. On IE, the previous formating of the divs remains. The solution took me about 2 hours, and it looks like this. Do not ask me if changing the floating now would work, ’cause I don’t know. I’m just to afraid even to think at such thing.

<p id="a1" style="float: left">a</p>
<p id="a2" style="float: left">a</p>
<p id="a3" style="float: left">a</p>
document.getElementById('a1').style.width='100px';  
document.getElementById('a2').style.width='100px';  
document.getElementById('a3').style.width='100px';  
document.getElementById('a1').style.backgroundColor = '#FF0000';    
document.getElementById('a2').style.backgroundColor = '#FF0000';    
document.getElementById('a3').style.backgroundColor = '#FF0000';
Share and Enjoy:
  • Facebook
  • Twitter
  • Identi.ca
  • LinkedIn
  • Reddit
  • Add to favorites

Permission denied to call method XMLHttpRequest.open

Posted by dragos on May 18, 2007
HTML, JavaScript / 1 Comment

May find more here!

Have you ever seen something like that? I recently had a very interesting experience within AJAX scripting. Let’s say you will access http://www.domain.ext, right? Now here comes my problem. There is a great difference between

XMLHttpRequest.open('http://www.domain.ext/file.html', ...)

and

XMLHttpRequest.open('http://domain.ext/file.html', ...)

The result? Opera’s console said just: Error, Internet Explorer said nothing, and only the Mozilla browsers did give me a hint. And the hint… an interesting exception of which I didn’t know anything till that moment.

If, let’s say, you’re accessing http://www.domain.ext and the Ajax script is written for http://domain.ext you will receive a very non explicit exception/error found in the title. After long searches on the internet I could not find anything clear, until…

I remembered that once I received this error within another website I was working at. At that moment I did not realize that I did find a solution, but hey… Who’s perfect?

Here’s a real thing. You know already that Ajax does not load on domain.ext pages from domain2.ext. This is a permission rule that cannot be forced that easy, but can can be avoided though a caching script. But did you know, also that Ajax cannot load a page even from a sub-domain of the domain you’re working with? It’s the same bugging rule that’s restricting this and from what I’ve tested till now, it’s true. And what do you think www.domain.ext is considered for domain.ext? Yes… it’s just an ordinary sub-domain…

The solution? A simple javascript class: location. How? Like this:

XMLHttpRequest.open('http://'+location.host+'/file.html', ...)

This is the solution I found for the problem showed above.

Now… If, for example you’re viewing domain.ext and you want do Ajax load something from sdmn.domain.ext, this is a completely different thing, and again it can be done with the caching script I was talking above. We write a simple php file in domain.ext, which will load the html from sdmn.domain.ext. (I will show how in another article, a little bit later. But you can find it on the internet if u ggl a bit.)

http://en.wikipedia.org/wiki/AJAX
http://en.wikipedia.org/wiki/XMLHttpRequest
http://en.wikipedia.org/wiki/Ajax_framework

Do remember please that Internet Explorer uses other javascript classes for Ajax. XMLHttpRequest is compatible only for Firefox (IceWeasel), SeaMonkey (old Mozilla / IceApe), Opera on Windows / Linux, Konqueror and, I think, Epiphany on Linux and MAC OS X’s Safari. There may be others of which I do not know.

Share and Enjoy:
  • Facebook
  • Twitter
  • Identi.ca
  • LinkedIn
  • Reddit
  • Add to favorites

Tags: , , , ,