|
HTML - Image Link Problem
Hey, im making a portfolio site and i am linking my images except when i link them i get a small blue border around it whihc moves it down a bit and it looks outta place i was wondeirng is there anyway to take this border out or not plz help. heres what it looks like be4 and after.
Similar TutorialsOk, what is the code to put in to get this done? I have image at: images/tables/image.jpg and i need to show it at work/portfolio/index.html The problem is if i link to images/tables/image.jpg it will now show it cause the path is wrong at work/portfolio/index.html, how do i set path to the image? do i just put ../images/tables/image.jpg or what is the right code? thanks! i'm trying to give a url link to a image...but after i gave the link, that image appears to be bumped up and automaticaly put a blue border around that image. site reference is mahinthan.net46.net plz help me to get rid from this problem thanks Hey all. I'm having a problem with my website's image links. For some reason there are orange bars around all of the images that are in link tags, and when you click on them they turn purple. They're very tacky and I have no idea why they're there. Here's my website's URL: www.populous3.co.nr Here's the code for one of the pictures: Code: <a href="images.htm"><img src="/images/images.jpg" /></a> Any help will be appreciated! Thanks, Suleiman Hello, I'm new to the forums =) I'm currently having a problem with my navigation which involves images. Initally I used the traditional image map method using area maps and the usemap function but it only worked in the webpage itself, and when the webpage shows in an iframe the links are nonexistent. So I sliced my navigation to give the sliced images the url link instead. As usual, they work on their own but when the page is shown in an iframe, some of the links disappear (you can't even hover on them) only in Firefox, Chrome and Safari. But some of the links are also still intact. In IE and Opera they work perfectly fine. Below is the code for the page which contains the navigation and links aforementioned, which will be displayed in an iframe of another page: Code: <!-- ImageReady Slices (mainframe.jpg) --> <table id="Table_01" width="971" height="565" border="0" cellpadding="0" cellspacing="0"> <tr> <td rowspan="4"> <img src="images/mainframe_01.gif" width="200" height="531" alt=""" style="z-index:-3;"></td> <td> <a href="defence.html" target="_parent" onmouseover="window.status='STET Defence'; return true;" onmouseout="window.status=''; return true;"> <img src="images/mainframe_02.gif" width="332" height="163" border="0" alt="" style="z-index:1;"></a></td> <td rowspan="4"> <img src="images/mainframe_03.gif" width="438" height="531" alt=""></td> <td> <img src="images/spacer.gif" width="1" height="163" alt=""></td> </tr> <tr> <td> <a href="maritime.html" target="_parent" onmouseover="window.status='STET Maritime'; return true;" onmouseout="window.status=''; return true;"> <img src="images/mainframe_04.gif" width="332" height="134" border="0" alt="" style="z-index:1;"></a></td> <td> <img src="images/spacer.gif" width="1" height="134" alt=""></td> </tr> <tr> <td> <a href="homelandsec.html" target="_parent" onmouseover="window.status='STET Homeland Security'; return true;" onmouseout="window.status=''; return true;"> <img src="images/mainframe_05.gif" width="332" height="138" border="0" alt="" style="z-index:1;"></a></td> <td> <img src="images/spacer.gif" width="1" height="138" alt=""></td> </tr> <tr> <td rowspan="2"> <a href="centre.html" target="_parent" onmouseover="window.status='STET Centre'; return true;" onmouseout="window.status=''; return true;"> <img src="images/mainframe_06.gif" width="332" height="130" border="0" alt="" style="z-index:1;"></a></td> <td> <img src="images/spacer.gif" width="1" height="96" alt=""></td> </tr> <tr> <td> <a href="https://mail.stet.com.sg/owa/auth/logon.aspx?url=https://mail.stet.com.sg/owa&reason=0" target="_parent" onmouseover="window.status='Login to Intranet'; return true;" onmouseout="window.status=''; return true;"> <img src="images/mainframe_07.gif" width="200" height="34" border="0" alt="" style="z-index:1;"></a></td> <td> <a href="sitemap.php" target="mainframe" onmouseover="window.status='Lost?'; return true;" onmouseout="window.status=''; return true;"> <img src="images/mainframe_08.gif" width="438" height="34" border="0" alt=""></a></td> <td> <img src="images/spacer.gif" width="1" height="34" alt=""></td> </tr> </table> <!-- End ImageReady Slices --> <div id="pict" style="position:absolute;top:200px;left:10px;z-index:0;"> <iframe name="news" src="news.php" FRAMEBORDER=no name="frame" allowTransparency scrolling=auto style="filter:chroma (color=#FFFFFF)" width="185" height="90"></iframe> </div> There is another iframe in this page which I wonder might be causing the problem. However even when I removed it the problem remains. Any ideas how to fix it? Would really appreciate the help, thanks! the title makes it sounds really confusing. Ok im making my first website, and i need help with a code, (as you can see on www.dalekblaster.co.uk) i have got a section at the top where the images change from one to another. The code is - HTML Code: // Set slideShowSpeed (milliseconds)
var slideShowSpeed = 5000;
// Duration of crossfade (seconds)
var crossFadeDuration = 5;
// Specify the image files
var Pic = new Array();
// to add more images, just continue
// the pattern, adding to the array below
Pic[0] = 'http://www.dalekblaster.co.uk/images/banner/dalekblasternexttime.jpg'
Pic[1] = 'http://www.dalekblaster.co.uk/images/banner/dalekblaster2.jpg'
Pic[2] = 'http://www.dalekblaster.co.uk/images/banner/dalekblastersjanexttime.jpg'
Pic[3] = 'http://www.dalekblaster.co.uk/images/banner/dalekblaster.jpg'
// do not edit anything below this line
var t;
var j = 0;
var p = Pic.length;
var preLoad = new Array();
for (i = 0; i < p; i++) {
preLoad[i] = new Image();
preLoad[i].src = Pic[i];
}
function runSlideShow() {
if (document.all) {
document.images.SlideShow.style.filter="blendTrans(duration=2)";
document.images.SlideShow.style.filter="blendTrans(duration=crossFadeDuration)";
document.images.SlideShow.filters.blendTrans.Apply();
}
document.images.SlideShow.src = preLoad[j].src;
if (document.all) {
document.images.SlideShow.filters.blendTrans.Play();
}
j = j + 1;
if (j > (p - 1)) j = 0;
t = setTimeout('runSlideShow()', slideShowSpeed);
Now i need help because, i want to link each picture on the slideshow to a differnet page or external site, but im not sure how. (but so they can go to different pages not the same one) can anyone help me? im kind of new to design and some of my image links have a small blue box around them and i dont know what it is. Im using dreamweaver to build my site. it is www.devilthreads.com if you want to check it out But how do i get rid of that damn blue box around the image link Say I have an image that is 400px tall, and 200 px wide. What do I have to do so that if the user clicks the top half of the image, it takes him to a certain link, and it takes him to a different link if he clicks the lower half? I think this is possiboe, and I do not want to use 2 images... Thanks! I appreciate all your help! I've got a photo gallery set up for my site, each gallery pops up in a new window. Within each gallery there are various thumbnails. Is there anyway I can link the thumbnails to open in a specified area of the window? (while still showing the other thumbnails) This is what I do have: <img src="images/Thumb/dress/dress3.jpg"> <img src="images/Thumb/dress/dress4.jpg"> <img src="images/Thumb/dress/dress5.jpg"> <img src="images/Thumb/dress/dress6.jpg"> --I haven't added the link html yet because I'm not sure if it will be different from the norm..please help I have never encountered this problem before and can't figure it out. I've created an include file that holds my left nav. It's a table that holds various images that are links. But the last two buttons (that are simple and small gifs) I've created will not render at all in IE6. In view source it shows the table tags fine, but strips out the image tags for those buttons. The really weird thing is that everyone else can see the images on their computers in Firefox, IE6 and IE7, Mozilla, etc... Also, if I take the actual links out of the href tag and leave it blank, the images show up fine. What the heck is wrong with my browser??? hi, I've tried for ages to use different methods to try to get the required code, but nothing seems to work. i'm trying to make a link which is an image, when it is clicked i'd like it to open the link in a new window. I also want the image on the original page to change once it has been clicked on. The target url need to be hidden on the mouseover on original page. for use in example: original image = image1.gif lnik url= http://my chosen site.html after click inmage = image2.gif I will be needing this to be able to be repeated for different target urls, all on the same page next to eachother. any help is much appreciated! confused idiot Hi, I've been working on a site which I'm going to launch soon, but I added an image link although for some reason I can't get it to become a link while I have it in the Nav Div. If i take it outside the nav div it will work normal but for some reason not where it is at. The site is http://shokzguide.com If you take a look at the blue download button to the right of the page you will notice that you cannot click on it even though it is a link, if anyone could help I would greatly appreciate it as I can't for the life of me figure out why it isn't working while I have it in the nav. Hi, I'm new here, and even new to coding websites. Well, it's going pretty well this far I think, but I have one problem now. I have placed a picture/logo which I have turned into a link. It's working very well and looks great, in Google Chrome! But in IE there's a "border" which is blue, and with mouse over it's red. Like all the other links on my site. But I don't want this "border" to be there, just like in Chrome. I have tried almost everything to remove it, but I can't. And I can't even figure out why it's there. Can somebody help me? Thank you. Best regards Thomas. How can I get rid of the jumping of page when I hover over the "I'm stopping global..." image here http://ranabtawi.com/index.htm Thanks I'm not sure if this belongs in HTML, CSS, or somewhere else entirely, but I thought I'd start here... I'm creating a photography website in which the background is black. Right now, the site is very basic...pretty much entirely done in HTML and a little CSS. I have a set of thumbnails that link to a full size image. I know that I could have the thumbnail link to another html page entirely, and have that page display my photo as well as background colors, but I was wondering if there was a way to link directly to the photo, yet have a black background when the browser opens the photo. Hello i need help getting a button to work in my website. It will be a link to another page. I have this html. I have three images.They are gifs. I also have three more in .png. I can make just about any kind of file. When i made the files i used transparency and interlaced. I'll attach images. I want one to appear when to mouse goes over it and one to appear when it's clicked. The attached ones are .png's. thanks I like to use TinyPic to add pictures to my websites, but I don't really do it for the background, Can someone provide the code to make the background from a link. Hey guys, I want to click a button that is behind an image (set in absolute position). The button that I am trying to click is within an iframe so I cant use any sort of javascript to click it. The click must be real and not faken. Iframe containing button ----> Image over it Is there anyway I can setup the image so I would be able to click thru it (add transparency setting or something like that)? The image must remain visible but I want to be able to click the button that is under it. The goal is to make the visitor click the image but it would actually click the button in the iframe behind it. Thanks alot guys, I have not touched HTML for months, now work brings me back to it. Simple question. I am using images as links. I don't want any symbol active or visited link around the image. How do I simply get rid of this. Thanks! Hi Guys, I have an image with link tags around it but it doesnt work in IE6. See code: <a href="http://www.site.com"><img src="images/support_button.png" class="supportbutton"/></a> .supportbutton { float : right; margin-top : -0.4em; padding : 0; border : none; } Hi Guys i have this image and i wont to add a link to it so it will take the user back to the home page, Would some one be able to help me? im aware this is pre amateur for some... Heres the snippet..... HTML Code: <table width="850" border="0" cellpadding="0" cellspacing="0">
<tr style="height: 110px">
<td style="background-image: url(/images/logo.png); background-position: left top;
background-repeat: no-repeat">
</td>
<td style="background-image: url(/images/ssl.png); background-position: right top;
background-repeat: no-repeat">
</td>
</tr>
</table>
I wont to add the link to the image "Logo.png" any suggestions or examples? Thanks for looking.. |
|||||||