SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Enthusiast
    Join Date
    Mar 2004
    Location
    USA
    Posts
    58
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    How to have a background image in a frame

    Hi:

    I have 3 frames in 3 columns. I have an image as background in the left frame which comes out without any problems. Middle frame has some contents. And I want to have a background image in the right frame. When I put the background image it is not showing up at all.I am using css and this is what I have in my css file for the right frame.
    css code.
    Code:
    #lframe{
    position: absolute;
    width: 100%;
    background-image: url("../QTimages/lground.jpg");
    background-repeat: repeat-y;
    }
    
    #rframe{
    position: absolute;
    width: 100%;
    height: 100%
    margin: 100px;
    background-image: url("../QTimages/rground.jpg");
    background-repeat: repeat-y;
    background-position: top left
    }
    I am using php to retrieve the images from the database so this is the part of the code to get the background image for the rightframe.

    PHP Code:
    PHP Code:
    <?php

    ...... 


    echo 
    "<html>\n"
    echo 
    "<head>\n"
    echo 
    "<title> Individual image </title>\n"

    echo 
    "<link rel=\"stylesheet\" href=\"./museum.css\" type=\"text/css\">\n"
    echo 
    "</style>\n"

    echo 
    "</head>\n"

    echo 
    "<div id=\"rframe\">\n"
    echo 
    "<body>\n"
    .... 

    echo 
    "</body></div>\n"
    ...
    This is the site I am working on. There are not any real data in the database yet. These are all dummy data.

    http://chil.cecs.missouri.edu/gvke53/TEMP/

    You can see that the background image is not showing in the right frame. Thanks for any help.

    mayflower

  2. #2
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,367
    Mentioned
    180 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    You have put the link to the css inside the style tags so its not working.
    Code:
     <style type="text/css" media=" Screen">
    <link rel="stylesheet" href="./museum.css">
    </style>
    Move the link element outside the style tags and it should work.

    Do you need to use frames? They are bad for accessibilty, practically invisible to search engines and a pain to use .

    Paul

  3. #3
    SitePoint Enthusiast
    Join Date
    Mar 2004
    Location
    USA
    Posts
    58
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Paul O'B

    You have put the link to the css inside the style tags so its not working.
    Code:
     <style type="text/css" media=" Screen">
    <link rel="stylesheet" href="./museum.css">
    </style>
    Move the link element outside the style tags and it should work.
    Paul
    I did this but still the background image is not showing up.


    Quote Originally Posted by Paul O'B
    Do you need to use frames? They are bad for accessibilty, practically invisible to search engines and a pain to use .

    Paul
    When I started on this project I wanted to do it with CSS but I never used CSS before and I posted here and other forums but I didn't get any workable solution. So the only other option I know how to do was frames that is why I had to do it using frames. I too wanted to avoid using frames. It still would be helpful if you could explain to me with some sample code how to make it work the way it is without using frames.

    The larger images are Quick Time Virtual Reality images which are huge in size (1-2M). So somebody suggested that in that case using frames should be okay considering the page load time.

    I want it to look the way it is now, say for example if I click on the Art button it should bring a set of thumbnails from DB on the right hand side and clicking on the individual ones should bring the larger file with details in the middle. I read many articles and tried out but it didn't work the way I wanted. Any suggestions would be greatly appreciated. Thanks

    mayflower

  4. #4
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,367
    Mentioned
    180 Post(s)
    Tagged
    6 Thread(s)
    I did this but still the background image is not showing up.
    wheres the code you used? Is the path to the image correct?

    The larger images are Quick Time Virtual Reality images which are huge in size (1-2M).
    I don't think the web is made for image like this

    If the images are that big then the couple of k in the side columns is hardly going to be noticed is it.

    I'd just do it as a normal page with main navigation on the top and sub navigation on the left and that would leave more page width for content to the right of the subnav. You'll have to load the menus everytime a page loads (as they will be integral) but thats hardly going to matter if your images are going to be that big.

    The way you have it with main nav on the left and subnav on the right is I think a little confusing as you are jumping from one sie to the other. Also when you select a different item on the left the middle content doesn't change so you have a situation where the centre content isn't actually matching either of the menus until a further item on the right is selected.

    Thats just my opinions and I may be completely wrong and you may be right

    Paul


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
  •