Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New Coder
    Join Date
    Jul 2007
    Posts
    56
    Thanks
    8
    Thanked 0 Times in 0 Posts

    Background Change depending on Browser Detection.

    I need a script that if a user has Firefox, Opera, Safari, or Mozilla that it will display one background image for the index page, and it will display another background if the user has Internet Explorer or Netscape. Due to HTML/Browser view incompatibility. The IE and Netscape make the background drop 7 pixels which throws off the whole page.

  • #2
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,461
    Thanks
    11
    Thanked 600 Times in 580 Posts
    something like this should work.
    Code:
    <body onload="setBG()">
    <h1>Welcome to my page</h1>
    
    <script>
    function setBG(){
    document.body.style.backgroundImage=((!!document.all)?'iebg.jpg':'w3bg.jpg')
    return}
    
    </script>
    
    </body>

  • #3
    New Coder
    Join Date
    Jul 2007
    Posts
    56
    Thanks
    8
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by rnd me View Post
    something like this should work.
    Code:
    <body onload="setBG()">
    <h1>Welcome to my page</h1>
    
    <script>
    function setBG(){
    document.body.style.backgroundImage=((!!document.all)?'iebg.jpg':'w3bg.jpg')
    return}
    
    </script>
    
    </body>
    That doesn't help me since I have no idea how to edit Javascript. XD

  • #4
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,310
    Thanks
    203
    Thanked 2,563 Times in 2,541 Posts
    Quote Originally Posted by Notre View Post
    That doesn't help me since I have no idea how to edit Javascript. XD
    Well, what you need to do is replace iebg.jpg with the name of the background image to be displayed if the browser is IE, and replace w3bg.jpg with the name of the background image to be displayed otherwise.

    However, there is a typo in rnd me's code, and Opera is not covered:-:-

    <body onload="setBG()">
    <h1>Welcome to my page</h1>

    <script>
    function setBG(){
    document.body.style.backgroundImage=((!!document.all || window.opera) ? 'w3bg.jpg : 'iebg.jpg') // delete the second ! and switch the jpgs
    return
    }

    </script>

    In English, if the browser does not support document.all (which is supported only in IE4+) or is Opera then display the background iamge w3bg.jpg. If the browser does support document.all then display the background image iebg.jpg.



    </body>
    Last edited by Philip M; 07-20-2007 at 08:41 AM.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •