HTML - Hovering Over Images
I have a friend that's making a site and she wants to know if there's such thing as HTML coding for when you hover over a thumbnail image and it then shows the full size of the image.
If not, then is there any CSS codes that she has to use for this action to be applausable? Similar Tutorialshttp://testingbar.atspace.com/index-test.htm When clicking within the yellow highlighted parts of the calendar, a tooltip pop ups to the right. But I also want a smaller tooltip that appears when you mouseover the yellow areas in the calendar. That tooltip will only include the title (bold uppermost row) from the part when you click on the event. That tooltip should have 1px border width, 4px padding and the same green background color as the more detailed tooltip. Can someone help me with this? Hello, Throughout this site I have layers that act as buttons. This is part of HTML code: HTML Code: <div id="Promo1"><a href="weeklyspecial.html">Details ></a></div> And this is the CSS behind it: Code: #Promo1 { position:absolute; width:70px; height:auto; z-index:6; left:122px; top:123px; background-color:#fff; background-image: url(../JPGs/ButtonBG_Navigation.jpg); background-repeat: repeat-x; background-position: left top; } #Promo1 a { width:100%; line-height:20px; display:block; font-family:Verdana; font-size:10px; color:#000; text-align:center; border: 1px solid #ddd; background-image: url(../JPGs/ButtonBG_Navigation.jpg); background-repeat: repeat-x; background-position: left top; } #Promo1 a:hover { border: 1px solid #ff0000; Please help me figure out how to make these buttons make a little sound when clicked and another when hovered? Do I put something on the :hover side? Thanks! Hey guys, I recently setup a basic "intranet" for my family, since we have a number of computers, and it would be easy to leave messages for each other, attach files, etc. It may not be an intranet per se, but it acts as one. I have setup "Appserv" on a computer that is always on, which is a package that installs everything you need to turn a normal PC into a server, and I have installed "Wordpress" into a folder in "root/wordpress/". What I want to do is create a file, index.* in the root directory and force each computer's browser to head to that file. Now what I want is for it to open as a normal webpage (since we all use Google as our homepage, that would be preferrable) with a small thin bar at the top/bottom, which says "Go to Intranet Home" or "Close This Window". Now I have tried a variety of ways to do this, including frames, but the problem is that the URL will not change. If i point the file to 192.168.1.6/index.php, it will show that as the address even if you type something into google and go to links etc (as it is the frame's URL, not the browser's). What I need is for the browser to open into a page that acts normal, except has a hovering bar that can send the family members to the wordpress home page. I was thinking that maybe CSS could do it but I'm not even sure if this is possible at all. If the URL dosen't change, its not possible for anybody to bookmark sites as it will always bookmark the same address. Please leave feedback even if the idea is not possible, any help is greatly appreciated. Thanks again, Curtis Hi People, I am trying to take a basic background image. Split it into 3 chunks (top bar, middle blank 1px high, bottom bar) The idea was that I would set the middle image to be 1px and make it repeat so that when the user scrolls down the page, the background image scales accordingly. Also so that it would look ok via different browsers. I cut my image into three, no problem there. I then thought it would be a simple case of inserting my image and setting the CSS accordingly but I am getting different results in IE and FF (but of course). Example: HTML CODE HTML Code: <div id="image1"><img src="images/image1.jpg" alt="image description"></div> CSS CODE PHP Code: body { margin-top:20px; } #image1 { text-align: center; padding-top: 540px; padding-bottom: 0; } When I put this in, the image moves down to the bottom of the page in both IE and FF. Of course FF looks like it place the image in the right place but IE ends up putting lots of white space underneath the image. Any ideas ? Also, Is there a much simpler way of getting the image to scale according to the person scrolling? I am keep to learn a few different methods as it all helps. Thank you all I have a two questions if you see an image on the web for example a map you would like to create yourself can you look at the webpage's source and use that as a guide? Does copyright laws apply? Well second question will come when I get an answer to first question. Thanks sunrise I could not find any previous post for this question but someone has sure had the same problem. Everying looks fine on my website if you use: http://sdgroceryoutlet.com However, if you use: http://www.sdgroceryoutlet.com it scrambles the .jpg images. Why would the images not show when adding the www. prefix? Need some help, please. Hi, I currently have a bit of a problem, you can see for yourself at http://el-nath.net/forum Notice that all the images are around 3-4 pixels off their place that they're supposed to be at. Can someone please view the source code and give me a solution? Hello everyone, I am currently working on a website that will have a simple gradient border (something like an "outer glow" from Photoshop) along the border of a nested table in the page. The final result will be a simple box with data centered in the middle of the page... However, my question is more related to programming in general. I have two options: 1. Have a linear gradient (1 px by 5 px) which is rotated in the 4 cardinal directions, and then tiled all around the page. Also there will be corners (5 px by 5 px) on, you guessed it, the corners. 2. Creating tables, for instance: //"invisible" is a font class with size="1px" <table class="invisible" cellpadding="0" cellspacing="0" width="710"> <tr height="100"> <td width="1" bgcolor="#000000"></td> <td width="1" bgcolor="#333333"></td> <td width="1" bgcolor="#666666"></td> <td width="1" bgcolor="#999999"></td> <td width="1" bgcolor="#CCCCCC"></td> <td width="1" bgcolor="#FFFFFF"></td> <td width="700" bgcolor="#FFFFFF"> <!-- TemplateBeginEditable name="body" --> SITE CONTENT HERE <!-- TemplateEndEditable --> </td> <td width="1" bgcolor="#FFFFFF"></td> <td width="1" bgcolor="#CCCCCC"></td> <td width="1" bgcolor="#999999"></td> <td width="1" bgcolor="#666666"></td> <td width="1" bgcolor="#333333"></td> <td width="1" bgcolor="#000000"></td> </tr> </table> which recreate the same action as tiling the gradient along the outside edges using the simple HTML colors. Which, from the standpoint of REDUCING actual work done by the server, would be the more effective (not my time, which clearly option 2 takes more of). I know very little about image compression, and how the whole process works for calling up images from a server. Any explanation is appreciated. Thanks again, BlitzKampf Can't seem to find the discrepancy within the code. All the image files are in the same location. As stated in the title, some images appear and some do not. http://webpages.charter.net/projects...vertmedia.html Thanks for you help, -=Devil Duck=- The title thread says it all i can't get the image next to each other it always seems to end up underneath...here is a screenshot. The arrow is pointing to were I want it to go. So how do I do thi guys ? I'm currently in the process of rebuilding my website and I'm having some trouble. I'm looking to get the page to look like this: http://img170.imageshack.us/img170/5833/designwh9.png This is what I'm at right now: http://www.bclw.ca/content/index2.html The buttons (unlike in the image design) are not touching each other. Is there a way to do this only using HTML? Or am I going to have to purchase one of those Website Design programs? Thanks for any help you can give! Hi, Does anyone know a code that can be used so that if there is no image to go into an image box the box will be invisible, i.e. there won't be a little box with a cross in it. Thanks Colin I want to try a couple of different approaches to putting medieval scroll-like images behind a menu and the body text of a site I am working on. I vaguely remember that there are separate commands to put images above, behind, and below a list. (Thinks something like scroll_top.gif, scroll_body.gif, scroll_bottom.gif). Can anyone help with that? Also, isn't there a way to do the same think with a div, eg: - image1 at the top - image 2 (repeating) as the body - image 3 at the bottom Thanks much as always! Joshua Hi, I'm kinda new to HTML.. I want to add 2 different images aligned horizontally, but one would be aligned on the left of the page, and one to the right.. how would I do that? Heyya, new here, and still fairly new to html. I just started using SSI includes (for obvious reasons), but I'm having an issue. When I preview the actual include file (menu.html), it looks just like it should. To see what it should look like, check out the front page, which just uses the HTML code rather than an insert. www.armoredchampions.com But when I use the include on a page, there is a gap between the two lines. I was originally using a <br> tag, but it had a gap, as if I was using <p>. I then eliminated the tag and made the table border just a little bit wider than the image in order to solve the issue, but the gap is still there. To see what it looks like you can check out this page: www.armoredchampions.com/staff.shtml Can anyone help me with this? I would really really appreciate it I need to display 40-50 images, one at a time, with a forward and backward button. No timer. Seems easy enough, but I don't know how to do it. Any tips would be greatly appreciated. Hi My site is at www.bigbadroo.com.au/dht/index.php It's looking ok in most browsers at the moment, but I have a couple of questions: 1) why is ie6 cutting off and repeating the background images? 2) why is ie6 putting big red crosses and borders on my three main button images? 3) how do I get the DIV box1 to extend all the way to the top of the screen in IE6 and IE7? Thanks for your time and help guys. Shaun Hi, i have an issue with images in that my site was up and running ok, then a computer crash ended my old PC (not sure if relevent). So new PC, now when i go into my ftp and upload an image from my computer, it will be there and i do the normal in that i get properties of image in ftp and add this into my html. At this point all is ok, image shows on website in new window but as soon as i sign out of my ftp any new images will disapear and just leave the box outline and red x. Sorry this is probrably something simple, but it`s been doing my head in for months. Any ideas, help please. how can i put images on my page using html or css where you cant right click and copy the image or see the image url. (kinda like a background image, but where i can add several of them) |