Imperial Outpost
Members
-
Joined
-
Last visited
-
I have to admit I was thinking the same thing. Maybe it might be a worthwhile exercise to find a template you like and try to recreate it exactly. If there's parts of it you can't work out then ask in here. Then you can take the skills you've learned from that and use them to design your own portfolio layout...
-
I would second that one - the older version is the book I started with...
-
I would use an Ajax request triggered by the drop down menus to update the picture. If you need more detail, gimme a shout.
-
I use PHP - imagecopymerge is the function you need. It lets you copy one image onto another, plus you can specify the alpha transparency for a proper watermark. As far as ease of uploading, there's several ways to go about it, but I would have thought some kind of jquery plugin, such as uploadify? Hope you get it sorted.
-
Did anyone figure this out? we7.com does a similar thing. I'm working on my brother's band website and want to add music to the site and something like that would be ideal.
-
As you're looking for driving distance, rather than a straight line, I would think that the Google Map API would be your friend here. http://code.google.com/apis/maps/
-
5 minutes work to change a template and upload it. £39 for .co.uk domain name. Money for next to nothing for them, plus it's a foot in the door - at some point the client will need more than a basic web presence and they are likely to stick with what they know.
-
Thanks for pointing me in that direction. I've had a read through and we both seem to be going at it from the same direction. From that, I've added #menu ul li { float:left; width: 100%; } which improves things a little (stops the text below the one selected vanishing). I can't find a drop down menu in IE that works the way I want it, so maybe it's a no-go, so I've decided to get the IE menu to line up, instead of overlap which is much improved, but still not quite working. Now it looks like this: which is workable, but sometimes if you move out of the menu and move back in, it leaves some of the boxes open and blank: Anyone have any ideas? Example here
-
It's probably something really simple that I'm totally missing - been fiddling with this code on and off since Thursday and it's starting to lose all meaning!
-
That would solve the dropdown hiding behind the current list item, but it causes each dropdown item to appear in the same position, rather than in-line with that option (you can see it here: http://www.selectlighting.co.uk/menuTest/test2.php). It definitely a step in the right direction though I think - I'll have a play around with that. Thanks for your help.
-
Thanks for checking that for me. IE8 tends to break the anti-virus on this machine, so I don't have it installed here. (Vista is only slightly lower on my hitlist than IE!). TBH though - I never even thought to check... Oops!
-
I'm having a nightmare trying to get a CSS dropdown menu to display correctly in IE. Firefox IE7 As usual Firefox/Chrome have no problem, but something's amiss in IE. I've tried messing with z-index, but to no avail. I could cheat and remove the problems by having the dropdowns display lined up with the edge instead of the overlap, but I don't like to admit defeat! The HTML is just a basic unordered list: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" /> <title>Menu Test</title> <link href="css/dynamicMenu.css" rel="stylesheet" type="text/css" media="screen" /> </head> <body> <div class="blackLine"></div> <div id="menuBox" style="display: block; margin: 0px auto"> <div id="menu"> <ul> <li><h2><a href="/ceilingLights.html" style="background-image: none">Ceiling Lights</a></h2> <ul> <li><a href="/chandeliersMainCat.html">Chandeliers</a> <ul> <li><a href="/modernAndContemporaryChandeliers.html">Modern & Contemporary Chandeliers</a> <ul> <li><a href="/3and4LightModernChandeliers.html">3 & 4 Light Modern Chandeliers</a></li> <li><a href="/5and6LightModernChandeliers.html">5 & 6 Light Modern Chandeliers</a></li> <li><a href="/7plusLightModernChandeliers.html">7+ Light Modern Chandeliers</a></li> </ul> </li> <li><a href="/traditionalChandeliersSubCat.html">Traditional Chandeliers</a> <ul> <li><a href="/3and4LightTraditionalChandeliers.html">3 & 4 Light Traditional Chandeliers</a></li> <li><a href="/5and6LightTraditionalChandeliers.html">5 & 6 Light Traditional Chandeliers</a></li> <li><a href="/7plusLightTraditionalChandeliers.html">7+ Light Traditional Chandeliers</a></li> </ul> </li> </ul> </li> <li><a href="/pendantLightingMainCat.html">Pendant Lighting</a> <ul> <li><a href="/modernAndContemporaryPendantLighting.html">Modern & Contemporary Pendant Lighting</a></li> <li><a href="/traditionalPendantLighting.html">Traditional Pendant Lighting</a></li> </ul> </li> <li><a href="/flushLightingMainCat.html">Flush Lighting</a> <ul> <li><a href="/modernAndContemporaryFlushLighting.html">Modern & Contemporary Flush Lighting</a></li> <li><a href="/traditionalFlushLighting.html">Traditional Flush Lighting</a></li> </ul> </li> <li><a href="/spotlights.html">Spotlights</a></li> <li><a href="/recessedLightingMainCat.html">Recessed Lighting</a> <ul> <li><a href="/fireRatedDownlight.html">Fire Rated Downlights</a></li> <li><a href="/lowVoltageRecessedLighting.html">Low Voltage Recessed Lighting</a></li> <li><a href="/mainsVoltageRecessedLighting.html">Mains Voltage Recessed Lighting</a></li> </ul> </li> </ul> </li> </ul> </div> </div> </body> </html> And the stylesheet info: @charset "utf-8"; .divider { height: 26px; width: 1px; float:left; } #menu { position: absolute; z-index: 5; width: 820px; background-color: #fff; } #menu ul { list-style: none; margin: 0px auto; padding: 0px; width: 116px; float: left; background: #fff; } #menu a, #menu h2 { font: 12pt Verdana, courier; color: #f00; display: block; border: none; margin: 0px; padding: 0px; } #menu a { color:#333; font-size: 8pt; line-height: 1.3em; background: #fff; text-decoration: none; padding: 4px 6px; letter-spacing: 0.1em; text-align:left; } #menu h2 a { font-size: 10pt; color:#777; text-transform:capitalize; letter-spacing: 0em; text-align:center; background-image:none; background-color:#FFF; margin:0px; padding:3px 0px; } #menu ul ul { position: absolute; width: 180px; left: -1px; z-index: +1; border: 1px #000 solid; } #menu li { position: relative; } #menu ul li a:hover { background-color: inherit; } #menu ul li ul li a:hover { color: #222; background-color:#DDD; } #menu ul ul ul { position: absolute; top: 5px; left: 85px; } div#menu ul ul, div#menu ul ul ul, div#menu ul li:hover ul ul, div#menu ul ul li:hover ul ul, div#menu ul ul ul li:hover ul ul{ display: none; } div#menu ul li:hover ul, div#menu ul ul li:hover ul, div#menu ul ul ul li:hover ul, div#menu ul ul ul ul li:hover ul { display: block; } Any help would be much appreciated. You can see it (almost!) working at http://www.selectlighting.co.uk/menuTest/
