Firefox background-position problem solved

•

What is DaniWeb IT Discussion Community?

You're currently browsing the JavaScript / DHTML / AJAX section within the Web Development category of DaniWeb, a massive community of 373,364 software developers, web developers, Internet marketers, and tech gurus who are all enthusiastic about making contacts, networking, and learning from each other. In fact, there are 3,649 IT professionals currently interacting right now! Registration is free, only takes a minute and lets you enjoy all of the interactive features of the site.

Join our community!

Please support our JavaScript / DHTML / AJAX advertiser: Lunarpages Web Hosting

Thread Tools Display Modes

Views: 1288 | Replies: 0

•

Join Date: Jan 2008

Location: istanbul

Posts: 264

Reputation: serkansendur is an unknown quantity at this point

Rep Power: 1

Solved Threads: 23

serkansendur serkansendur is offline

Offline

Posting Whiz in Training

Firefox background-position problem solved

Mar 11th, 2008

I had a background image for one of the container divs in my page. I positioned it to a specific pixel using its style properties. It worked fine in the internet explorer but was located to a wrong position when displayed by firefox. So i wrote the following code to get around this problem, it worked.

 Help with Code Tags 
 html Syntax (Toggle Plain Text) 
<div id="container" style="background-image: url(images/navigationMenut/left-tile.jpg);background-repeat: no-repeat; background-position: left 109px;">
</div>
<div id="container" style="background-image: url(images/navigationMenut/left-tile.jpg);background-repeat: no-repeat; background-position: left 109px;">
</div>

I insert the following script right after the container div.

 Help with Code Tags 
 html Syntax (Toggle Plain Text) 
<script>
   // checks the browser type to see if it is firefox
   if (navigator.appName.indexOf('Netscape') != -1)
   {
       // changes the position accordingly
      document.getElementById('container').style.backgroundPosition 
      = "left 107px";
    }
</script>
<script>
   // checks the browser type to see if it is firefox
   if (navigator.appName.indexOf('Netscape') != -1)
   {
       // changes the position accordingly
      document.getElementById('container').style.backgroundPosition 
      = "left 107px";
    }
</script>