SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Addict Normal75's Avatar
    Join Date
    Oct 2001
    Location
    Vancouver, Canada
    Posts
    245
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Change div background image from drop down

    Hi guys, below code seems to work perfectly with the exception that the background image isn't populated on select. Background color is working though. Can someone please take a quick look and see if you can point me to the right direction? Your help is greatly appreciated.

    thanks.

    PHP Code:
    <script type="text/javascript">

    function 
    showDiv()
    {
      
    // hide any showing
      
    $(".details_div").each(function(){
          $(
    this).css('display','none');
      });

      
    // our target
      
    var target "#details_" + $("#test_select").val();                                                                                                                                

      
    // does it exist?
      
    if( $(target).length )
      {
        
    // show it
        
    $(target).css('display','block');
      }
    }

    $(
    document).ready(function(){

      
    // bind it
      
    $("#test_select").change(function(){
        
    showDiv();
      });

      
    // run it automagically
      
    showDiv();
    });

    </script>
    <style>
    .details_div
    {
      display:none;
    }
    #details_book
    {
            background:url(images/imageBook.jpg)
                    border: 1px solid #cdcdcd;
                    background-color:#777;

    }
    #details_movie
    {
            background:url(images/imageMovie.jpg)
            border: 1px solid #cdcdcd;
                    background-color;#888;
    }
    </style>


    <select id="test_select">
      <option value="">- Select - </option>
      <option value="book" selected="selected">Books</option>
      <option value="movie">Movie</option>
    </select>

    <div id="details_book" class="details_div">BOOK DETAILS</div>
    <div id="details_movie" class="details_div">MOVIE DETAILS</div> 
    ~It will come to me one day~

  2. #2
    SitePoint Evangelist speda1's Avatar
    Join Date
    Jan 2002
    Posts
    550
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    If the border and background color are changing but the background image does not load, it sounds like the path to the image might be invalid.

  3. #3
    SitePoint Addict Normal75's Avatar
    Join Date
    Oct 2001
    Location
    Vancouver, Canada
    Posts
    245
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    hmm, very strange, i changed it to full path but the image still not loading.

    PHP Code:
    background:url(http://www.domain.com/images/imageMovie.jpg) 
    ~It will come to me one day~

  4. #4
    SitePoint Addict Normal75's Avatar
    Join Date
    Oct 2001
    Location
    Vancouver, Canada
    Posts
    245
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    My bad, the script works, i just realized i missed the semicolon. Sorry guys.
    ~It will come to me one day~


Bookmarks

Posting Permissions

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