|
HTML - No Border When Images Are Clicked On.
Hiya!
My question today is- how do you disable the border that pops up when clicking on an image, either in HTML or DW, doesn't matter. Thanks! Example: Similar TutorialsI have had this problem on almost all the websites I've made and I'm too picky to let it go... When I make the navigation images/buttons for a website, I set the border to zero as usual and link each image to its respective page. But, when I click on the image to take me where it's supposed to, this pesky dotted border appears around the edge of the image after it has been clicked and it remains there until I click on something else on that page. (This also happens to text links when clicked, but I'm not too worried about the text links.) For the websites I've made that go to an entirely new page after an image link is clicked, the dotted line appears around the linked image after it's clicked and before the next page has loaded, but then after the new page loads the dotted line is gone. But, for websites I have built that utilize frames, because the new page that loads is in an iframe, and because the page the navigation buttons are located on never changes, the dotted border stays around the image after its been clicked and, like I mentioned earlier, doesn't go away until I click on something else on that same page. An example of this can be seen when you click the images in the navigation column along the left side of a website I built located at the following URL: http://www.djprogress1.com/ This border problem could be specific to my website browser (I use Firefox), but I am not sure. And the border could be added entirely by the browser and there may be no way to get rid of it through coding, but again, I am not sure of this. So, does anyone know if anything can be done to fix this or am I stuck with these dotted borders? Thanks, Jase Hello! I hope someone can help! On the left column of my website he http://www.showlistportland.com ...there are ads. Hyperlinked images. But, when clicked they move out of the way!! How can I stabilize these images??? Any help is much appreciated!!! Thanks, b Hello, I have designed sites in the past but am in need of some assistance. I am designing a website for an artist who wants to be able to offer his clients fine art prints for sale. He needs to be able prints with several different product options; i.e. canvas print with 1" stretch, 2" stretch and framed prints. I want to be able to offer check boxes (or equivalent) that will display an image of the different product options available. If the 1" stretch check box is checked I need an image of a canvas on a 1" gallery wrap frame to be displayed. If they click on the "frame" check box, I need an image of a framed painting to be displayed. What is the best method to use to accomplish this? I've researched and experimented but am at a bit of a loss. Any help will be greatly appreciated. Thank you in advance!! -John I'm making an HTML design on notepad, and I got some images for links, but when I view it on a webpage, the images have a purple border. How to I remove this? Hi, I am getting a boder in firefox for a hyperlink image. this is the code <a href="default.aspx"><img src="Images/Home.gif" width="100" height="20" alt="Home" border="0"></a> It's working fine in IE6 but i am getting a blue border in firefox. Can someone tell me how to solve this problem? Thanks Raja I have a problem with Firefox. Although I am using set no border on a href and img tags I still get a border. Other browsers don't have this. This is my code, I've set the link border and image border to orange and pink dotted lines to show the black solid line. When I set these to no border the black line remains. Quote: <html> <head> <style> A:link, A:visited, A:active, A:hover { outline: none; background:none; border:5px dotted orange; padding: 0;text-decoration:none} img { border:5px dotted pink; display:block; margin:0; padding;0; } </style> </head> <body> <a href="/" > <img src="./img/bretzy-wht.gif" > text </a> </body> </html> You can see it live he http://tetsuo.gol.ad.jp/bretzy/new.html Thanks in anticipation. Brett Hi, I am using Dreamweaver CS3 to create a site, by default i have learnt that when you use an image as a link to another page, dreamweaver creates a coloured border around your linked image. I have since been able to get rid of this border by adding border="0" into my img tag however this now has caused my rollover not to work before clicking on the image to take you to the linked page. this is my code; any ideas how i can fix this? <td colspan="4"> <a href="About Us.html"><img src="images/About_Off.jpg" border="0" alt="About Us" name="Aboutus" width="120" height="64" id="Aboutus" onMouseOver="MM_swapImage('Image2','','images/About_On.jpg',1)" onMouseOut="MM_swapImgRestore()"></a></td> <td colspan="6"> Any help would be greatly appreciated. Hi Anybody know where I can get a free bit of code that will show how many times a thumbnail has been clicked?? I ant to show viewers how many times thumnails have been clicked by showing the number of clicks under each thumbnail. Leroy Hello everyone! I have a quick questions that I cannot figure out the past few months. I have a website for the private school I work at and we have our webpage set up mostly using Dreamweaver with .html pages and Dreamweaver templates. Here's my question: When links on the top dropdown menu bars are clicked, they disappear when you go back and look, they are still there, but just not visisble until I reset the browser cookies and history. Any ideas??? BTW, the website is www.scrantonprep.com If you use the dropdown menus up top and click on something, you will then see that when you go back or access the site again, the one you clicked on disappears. Any help with this matter would GREATLY be appreaciated!! Hey guys, I was wondering if there was a possible way to make a link disapppear after it is clicked, and for it to stay that way until the link is changed. Help? Thanks Hi.. Back with more image questions.. May i know how/what do i do if i want to have a smaller image (in a size that i want)on my website.. and when i click on it.. it goes to a new page and shows e actual size? Right now, what i have is this.. .image { height: 85px; width: 85px; } <div style="position: absolute; top: 350px; left: 60px; z-index: 5;"> <img class="image" src="http://img97.imageshack.us/img97/6893/honey.jpg"> </div> <div style="position: absolute; top: 438px; left: 60px; z-index: 5;"> <img class="image" src="http://img82.imageshack.us/img82/4149/jessicaalba.jpg"> </div> Thanx.... when i click on a link on my "test page" the div with my links in it moves up...but when i click back to the "home" page it moves back down take a look at the attached file to see what i'm talking about...is there any way of fixing this...it does this on both FF and IE 8. can someone help me with this...if it's something that i simply have to deal with then that's fine...just thought that maybe something was wrong and could be fixed. i know.. stupid question.. i should know how to do this.. but i dont.. how do i make a layer appear when i link is clicked? i want to have [?] next to something, and when clicked, a layer becomes visible that shows some text, then when an X on the layer is clicked, the layer becomes invisible again i know it has to do with visible=true/false.. but idk what to do.. help please Hi guys, I'm looking for a script or some code that would change the name of the link once clicked. Say I have a link that says: CLICK HERE TO SEE MAP Once I click it, the link says: BACK TO DESCRIPTION And once I click this one, it goes back to: CLICK HERE TO SEE MAP Any ideas? Hi all i have an upload form, and when the upload button/image is clicked to upload the file, i would like to have this cool ajax loader that just moves with some text under it saying "uploading...please wait". What is the easiest and best way to do this? I have looked all around javascript, etc and cant seem to find a perfect simple solution. I am adding this in my .tpl file THanks I have a form with radio buttons. I want it so that only one is selectable at a time and if radiobutton 1 is selected then whenever another radiobutton is selected radiobutton 1 will be deselected. Here is the code: HTML Code: <html> <head> <title> </title> <script src="script.js"> </script> </head> <body> <form> <input type="radio" id="hbEgg" value="hb"> <label for="hb"> Hard Boiled Egg </label> <br /> <input type="radio" id="mbEgg"> <label for="mb"> Medium Boiled Egg </label> <br /> <input type="radio" id="fbEgg" value="fb"> <label for="fb"> Full Boiled Egg </label> <br /> <input type="radio" id="ebEgg"> <label for="eb"> Extra Boiled Egg </label> <br /> </form> </body> </html> Thanks in advance. I'm swapping out an image through javascript, and when the user click the image it becomes outlined. Is there some way to prevent this from happening? Thanks for any help. Hi, i want some help regarding HTML links. I have a table containing topic and topic id. and another table having topic_id, sequence_no and Replies columns. I have a php + mysql script which show all the topics as html links. Now what i have to do is when any of link is clicked it should get identified and all the corresponding Replies should be displayed sequencially. I dont know how to identify and fetch topic_id on which i have clicked. Please help. Thanks, Jaas. i have an html form that uses javascript to calculate the total price of gift cards. when i use a button for submit, everything is peachy. when i use an image to submit, the form races to the top and shows the top line of the page. the text is enclosed within a div tag that has a set height with auto as the overflow command. i removed the height and overflow, thinking that the enclosure was causing this. nope! same thing happened. this is the submit code: <input type="image" src="images/buttons_contact_calculate.gif" onclick="calcard(this.form)"><input type="text" name="totalprice" size="8"><br><input type="image" src="images/buttons_contact_reset.gif" name="reset" /> the javascript code is this: function calcard(form) { $totalprice = 0; if(form.card_twentyfive.checked==true){ twentyfive = (25 * form.twentyfive_no.value); } else { var twentyfive = 0; } form.totalprice.value = twentyfive + fifty + seventyfive + onehundred + twohundred + ".00"; } As indicated in the last line, there are five if statements including the twentyfive statement shown here for an example. the css is this: .text_box { position: absolute; top: 280px; left: 0px; width: 100%; z-index: 15; } .text { position: relative; left: 0px; top: 0px; width: 473px; height: 406px; overflow: auto; padding: 0px 30px 0px 503px; font-size: 13px; font-family: "arial"; font-weight: normal; line-height: 150%; letter-spacing: 0px; text-align: justify; color: #FFFFFF; z-index: 5; } any ideas about what is going on? Hello Guys, I use Named Anchor to navigate within my webpage. Is there any way how one can navigate back to the clicked link from the destination? Normally the backspace works. But I would like to add a link at the destination and clicking this link would take me back to the clicked-link. Is this possible? I hope I made myself clear. If any of you can give me some advise about this issue, it would be much appreciated. Thanks in advance, Chuma P.S - I read in a site that using the <li> tag can do this. I am unsure how that works either. If any of you have any idea about this, please let me know. Thanks. |
|||||||