ober Posted February 7, 2008 Share Posted February 7, 2008 www.americanbeautytools.com/site The header image is picked from 6 images randomly. The paths are always correct and it always appears in Opera/FF/IE7. In IE6, the image just doesn't appear some of the time. Anyone have any clue what I might be doing wrong or is it just IE? Quote Link to comment Share on other sites More sharing options...
TheFilmGod Posted February 7, 2008 Share Posted February 7, 2008 Are you using php? Just have php grab a random number from 1 to 6 and then depending on the # grab that image. You would need to declare all background images in the css file and then just have different class for each background image and apply it through php. Quote Link to comment Share on other sites More sharing options...
ober Posted February 7, 2008 Author Share Posted February 7, 2008 That's quite possibly the worst idea I've ever heard. This is all I should have to do: <div id="logotest" style="background-image: url('../images/header/header<?=rand(1,6)?>.jpg');"></div> Quote Link to comment Share on other sites More sharing options...
GameYin Posted February 7, 2008 Share Posted February 7, 2008 It's not neccessarily the WORST idea. Very...creative of him to think of that. Quote Link to comment Share on other sites More sharing options...
TheFilmGod Posted February 7, 2008 Share Posted February 7, 2008 That's quite possibly the worst idea I've ever heard. This is all I should have to do: <div id="logotest" style="background-image: url('../images/header/header<?=rand(1,6)?>.jpg');"></div> Using inline css? Not a much better idea. Quote Link to comment Share on other sites More sharing options...
AndyB Posted February 8, 2008 Share Posted February 8, 2008 That is really strange. I opened the page with IE6. Hit refresh about 30 times and viewed the generated source between refreshes. I managed to get a missing image about half the time!! I also noted that all 6 of the images do appear as the background during my testing, so (as you already knew) there isn't anything intrinsically 'wrong' with any image. Heaven only knows what causes that! Quote Link to comment Share on other sites More sharing options...
ober Posted February 8, 2008 Author Share Posted February 8, 2008 Hmm... well that's not too helpful, but thanks for confirming the insanity. Anyone have any clue? Quote Link to comment Share on other sites More sharing options...
AndyB Posted February 8, 2008 Share Posted February 8, 2008 It's a long shot, but someone had a similar bizarre problem with apparently perfect source code and IE misbehaving ... Try removing the comment lines before and after the code line for the background image and see if IE improves. Quote Link to comment Share on other sites More sharing options...
ober Posted February 8, 2008 Author Share Posted February 8, 2008 comment lines... I don't see how that could affect it but I'll give anything a shot at this point. Quote Link to comment Share on other sites More sharing options...
ober Posted February 9, 2008 Author Share Posted February 9, 2008 I removed the comment lines, I played with the width of the container... I'm not sure what else to do. Anyone have any other bright ideas? Quote Link to comment Share on other sites More sharing options...
AndyB Posted February 9, 2008 Share Posted February 9, 2008 Can you post the CSS for the logo container, and the (presumably php) code that generates the html to display the random background image? Then I can 'play' at home to see what I can do. Quote Link to comment Share on other sites More sharing options...
bronzemonkey Posted February 9, 2008 Share Posted February 9, 2008 I just refreshed your page 25 times in IE6 and the header images show up every time. Perhaps you have already fixed the problem? But looking at your code there are a few things you should consider: - Put your code through a validator and fix the errors that are getting flagged (some are very simple ampersand errors). Whenever something goes wrong check that it isn't a little coding error first. - Eventually you should get rid of the inline styling and remove the use of print media pt units in a stylesheet for screen media. - It is not semantic or necessary to be using an empty div to contain a background image. Either use an actual image (and store the path, alt text, dimensions in your php array) or apply the background image to an existing "header" div that contains your top level navigation. You can get php to assign different classes to the header div that correspond to different background images. - You don't need to be using {vertical-align:middle;} on a div element and I also never put ' ' around the paths to the background images in my css. It doesn't seem to be invalid but it also might cause problems for some browsers? Things will probably get easier with time as you get used to ditching some of the "table layout" coding concepts (and to be fair everything that has gone wrong for you has been in IE6...no surprise!). Anyway, I had no problems looking at your site headers with IE6! Quote Link to comment Share on other sites More sharing options...
ober Posted February 10, 2008 Author Share Posted February 10, 2008 I just ran through it and couldn't get it to appear about 50% of the time, so it's definately not fixed. 1) I will validate ... haven't gotten around to that. Either way, I really doubt that is the issue in this case. 2) Get rid of inline styling? No offense, but I'd have a very hard time believing you put EVERYTHING in your css file. I do agree with swapping out the pt usage.. but we've been around that block. 3) ... yeah, again, not sure this would fix anything. 4) not sure where that is being used but I'll look into it. I don't normally put the '' in there either but someone else suggested it so I was desperate. It doesn't seem to make it any worse. And I'm not sure what you mean by "table layout coding concepts"... I haven't used a table for layout in close to 5 years. Maybe you can explain that one further? Quote Link to comment Share on other sites More sharing options...
bronzemonkey Posted February 10, 2008 Share Posted February 10, 2008 I just ran through it and couldn't get it to appear about 50% of the time, so it's definately not fixed. I can't replicate your problems in IE6 so I can't suggest any solutions other than those I already made (like using an image). I will validate ... haven't gotten around to that. Whenever you have a problem it is a good habit to check your html/css for errors first. No offense, but I'd have a very hard time believing you put EVERYTHING in your css file. Why would I recommend something if I do it another way? I have yet to find a situation where I needed to use an inline style, and I'm not bothered what you believe because I'm only wasting my time here to help. You're using inline styles in places where simply adding declarations to the stylesheet would be more efficient, give you greater flexibility, and helping you to avoid digging around in html files when all you want to do is alter the presentation. If you want to keep using inline styles, be my guest, I'm not here to beat people over the head. yeah, again, not sure this would fix anything. It is the most widely used method of achieving what you are trying to achieve. Surely spending 5 minutes trying it out is worthy of your time? And I'm not sure what you mean by "table layout coding concepts"... I haven't used a table for layout in close to 5 years. Using an empty div to display a background image, using divs with classes like "sidemenu_header" or "productTitle" to display headings...that is what I'm talking about. A heading should be wrapped in a heading tag, an element should not be empty. It's not going to solve your current problem but it will help you to create cleaner, more semantic, html documents that will prove easier to style and debug. Anyway, I helped you fix your other problems but perhaps someone else will help you with this one. Good luck. Quote Link to comment Share on other sites More sharing options...
TheFilmGod Posted February 10, 2008 Share Posted February 10, 2008 The problem lays in the way IE6 caches the webpage. For those who are using IE6 and don't have a problem have cache turned off. To solve this issue, I would recommend using php headers to tell IE6 that the content is not cache-able. Or you could just do what I said in the very beginning, and that is to create separate css declartions for each bacground image and have php pull out the proper css class. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.