Sirax Posted March 15, 2010 Share Posted March 15, 2010 Hello all,I'm working at a new website, my personal Portfolio website, I've designed the layout in Photoshop and now I'm building it into HTML / CSS...Now I have placed to buttons on the bottom of the main content page, but when you go over with the mouse-pointer for the first time, if flashes in a weird way, and second time when you go over with mouse, its all ok.This is the link where you can test this issue out: HereAs I said, you must take a good look at the button when you go over with mouse, because the issue happens only once, the first time you go over. You can re-produce the issue by pressing ctrl + f5.Does anyone know why those 2 buttons are doing that? And is there a fix for it?Thx in advance... Link to comment Share on other sites More sharing options...
Ingolme Posted March 15, 2010 Share Posted March 15, 2010 When you hover over the button, it has to load the second image, it takes a moment to load it because it has to send a request to the server. Link to comment Share on other sites More sharing options...
Sirax Posted March 15, 2010 Author Share Posted March 15, 2010 And is there a way to fix this issue?If you need to see the CSS code please ask and I can share it this evening... Link to comment Share on other sites More sharing options...
Synook Posted March 15, 2010 Share Posted March 15, 2010 You can pre-load the rollover image - the best way to do this is with CSS sprites. Link to comment Share on other sites More sharing options...
jeffman Posted March 15, 2010 Share Posted March 15, 2010 Let me throw in a second vote for sprites. It's a piece of advice a lot of new designers find intimidating, so they look for other solutions. But it really is the best way to handle toolbar and button rollovers. And since you have PhotoShop experience, you should not find it very difficult at all. Link to comment Share on other sites More sharing options...
Sirax Posted March 16, 2010 Author Share Posted March 16, 2010 Thanks for all the tips, but that CSS sprites was not so clear for me... but I got the issue fixed with a javascript preload script. That worked also Link to comment Share on other sites More sharing options...
thescientist Posted March 16, 2010 Share Posted March 16, 2010 just keep in mind some users to your site may not have javascript installed. Sprites covers everyone. Link to comment Share on other sites More sharing options...
Sirax Posted March 16, 2010 Author Share Posted March 16, 2010 Yes I know, but I read this page about CSS sprites but I don't get it right away.I was also wondering... Why does that "flashing" only happens with my buttons in the content area? And not in the navigation menu? Because the navigation menu is build the same way as my content buttons... With 2 different images.Can you explain this? Link to comment Share on other sites More sharing options...
Ingolme Posted March 16, 2010 Share Posted March 16, 2010 Because in your other menu you already loaded the second image by using it to mark the current page. Link to comment Share on other sites More sharing options...
Sirax Posted March 16, 2010 Author Share Posted March 16, 2010 Ok now I get it :)Thx for the explanation... Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.