|
HTML - Opening Link From Image Slideshow.
Hey there,
Currently have Code: slideimages[0]='<a href="boxers/paul.html"><img src="images/boxerpaul.jpg" border=0"></a>' Im looking at opening a new window when you click this picture that will open a 600x600 window without toolbars but just cant seem to get it to work. Have tried, Code: <a class="lol" href="javascript:void(0)"onclick="window.open('boxers/paul.html','welcome','width=600,height=600,menubar=yes,status=yes')"></A>
But with no luck. Appreciate some help thanks. Similar TutorialsHello all, I have created a basic slideshow from dreamweaver's template provided. I want to add one link right next to the 'Next' button that says 'download full size image'. Is this possible to do without manually do it and manually pointing it to the correct file? I would appreciate any help. Thanks, Lorne Hey guys I got this: <a href="http://www.youtube.com/watch?v=mdWkKKSckNk target="_blank"<font size="3" face="arial" color="black">Sony Video</font></a> But its not opening in a new tab, and all the forums and posts about it are 4 years old and say that it's impossible. So what is the code to open a hyperlink in a new tab? Thanks in advance Sensen Hi guys, new to this, and trying to learn. I have some code in a newsletter which opens a new page from a link perfectly well in a pc browser, but fails to open the same link on my iphone, which just asks me to 'save image' or 'copy'. My code below: <td width="200" align="left" valign="top"><a href="http://bit.ly/xxxxxx"><img src="xxxxxxx.jpg" width="195" height="150" alt="xxxxx" /></a></td> Also, I've tried opening a link from another newsletter on my iphone which works perfectly well, as below: <span style='font-size:9.0pt;font-family:"Arial","sans-serif";mso-fareast-font-family: "Times New Roman"'><a href="http://www.audible.co.uk/pd?asin=B005XOXIPM"><b><span style='text-decoration:none;text-underline:none'><img border=0 id="_x0000_i1038" src="http://ecx.images-amazon.com/images/I/41gzRQAgY+L._SL95_.jpg" alt="Steve Jobs" title="Steve Jobs" class=adbl-prod-image></span></b></a><o:p></o:p></span></p> I can't see the specific difference, plese help. Thanks i have a site where there is an iframe. The iframe loads a page from another website which has links on it. when a person clicks on a link, it loads the next page within the iframe which is ok. This next page it load also contains links and when a person clicks one of these things, it then loads a checkout page within the iframe which is not so good at all as this page is secure, but because it exists within the iframe now, it wont show as secure to people viewing it. I would like to know how i can have the links from the next page mentioned load in a new tab or browser window so that the secure checkout page is now on its own and the https and secure padlock show to the user. Any help is greatly appreciate! Hello I'm now well on my way to making my first website from html code. Please could someone give me the examples of: 1) Opening a link in current tab 2) Opening a link in new tab 3) Opening a link in a new window Hi all, I cant seem to manage to put links to the slideshow I'm using. http://fifthmammoth.co.uk/slideshow/example4.html This doesn't appear to work: Code: <div id="slide_01">
<div id="myShow-1" class="slide-show">
<div class="slide first">
<a href="pro_scherm/index.html"><img alt="" src="slideshow2/images/slide_01.jpg" width="300" height="200">
<div class="slide-caption">plaatje 1</div></a>
</div>
<div class="slide">
<img src="slideshow2/images/slide_02.jpg" width="300" height="200">
<div class="slide-caption">plaatje 2</div>
</div>
<div class="slide">
<img src="slideshow2/images/slide_03.jpg" width="300" height="200">
<div class="slide-caption">plaatje 3</div>
</div>
</div>
Another thing I'd like to accomplish, to make a link between the slideshow in the mainscreen, and the menubar below. Ideally, if you rollover the slideshow, the matching project in the menubar below lightens. Is it possible to create a rollover effect like this? Your help would be really appreciated! Hello, I am needing help finding out how to remove a link in my HTML slideshow code. I made the slideshow for this website using slide.com and want to remove the link behind it that directs you to their site! The slideshow is fine but when you click on it, it directs you to "Their Site", I don't want that. I was wondering if the code was embedded, please help! Here is the code: <p style='visibility:visible;'><object type='application/x-shockwave-flash' data='http://widget-a3.slide.com/widgets/slideticker.swf' height='200' width='250' style='width:250px;height:200px'><param name='movie' value='http://widget-a3.slide.com/widgets/slideticker.swf' /><param name='quality' value='high' /><param name='scale' value='noscale' /><param name='salign' value='l' /><param name='wmode' value='transparent'/> <param name='flashvars' value='cy=ms&il=1&channel=2666130979436416163&site=widget-a3.slide.com'/></object><p style='white-space:nowrap'><a href Http://www.nonvoicebpo.co.cc In the above site, the header image is not opening properly in Opera Browser, Header image as a small gap in the right side corner. How do I make a slideshow where images roll and when clicked on go to another page? Hi everyone, I'm looking for a html/css script that will allow me to do something similar to the image slideshow on http://trilogyproducts.com/. The Trilogy Products slideshow is in flash, however we were hoping to replicate it in HTML - in particular the fade in and out automated slideshow, PLUS the ability to click on to the little circle navigation and fade out the current shot and fade in the selected shot. Any help would be very much appreciated. Thanks Bec Hi I have multiple images on my home page working in a slideshow as you can see at www.1bit.org.uk/yourhome But, what I want is the same as what I have on this site: http://www.villavacationsvip.com/viprestaurants.html The difference is on that second slideshow, it uses flash. I don't want to use flash so is this possible to do? Hey guys, my problem is I need this code to be tweaked so that when the page is loaded there are 5 thumbnail images between the forward and backward buttons. Currently, the way it is configured, only three images show to start, but as you click on a thumbnail to load a new picture, more thumbnails show up, up to five. I tried to change this myself, only to have the wrong image load when the thumbnail is clicked and other problems. So here is the code in question: HTML Code: <body onload="preloadImages();" bgcolor="black">
<div id="wrapper">
<div id="layer1">
<div style="position:relative;width:958px;height:645px;-adbe-g:p;">
<div style="position:absolute;top:544px;left:112px;width:69px;height:25px;">
<a onmouseover="changeImages('HomeText','Images/HomeTextRolloverGif.gif');return true" onmouseout="changeImages('HomeText','Images/HomeTextGif.gif');return true" href="IanGIbbonsPhotographyMain.html"><img id="HomeText" src="Images/HomeTextGif.gif" alt="" name="HomeText" height="25" width="69" border="0" /></a></div>
<div style="position:absolute;top:544px;left:256px;width:84px;height:23px;">
<a onmouseover="changeImages('AboutText','Images/AboutTextRolloverGif.gif');return true" onmouseout="changeImages('AboutText','Images/AboutTextGif.gif');return true" href="IanGIbbonsPhotographyAbout.html"><img id="AboutText" src="Images/AboutTextGif.gif" alt="" name="AboutText" height="23" width="84" border="0" /></a></div>
<div style="position:absolute;top:544px;left:400px;width:67px;height:25px;">
<a onmouseover="changeImages('HireText','Images/HireTextRolloverGif.gif');return true" onmouseout="changeImages('HireText','Images/HireTextgif.gif');return true" href="IanGIbbonsPhotographyHire.html"><img id="HireText" src="Images/HireTextgif.gif" alt="" name="HireText" height="25" width="67" border="0" /></a></div>
<div style="position:absolute;top:544px;left:528px;width:112px;height:21px;">
<a onmouseover="changeImages('ContactText','Images/ContactTextRolloverGif.gif');return true" onmouseout="changeImages('ContactText','Images/ContactTextGif.gif');return true" href="IanGIbbonsPhotographyContact.html"><img id="ContactText" src="Images/ContactTextGif.gif" alt="" name="ContactText" height="21" width="112" border="0" /></a></div>
<div style="position:absolute;top:544px;left:704px;width:131px;height:22px;">
<a onmouseover="changeImages('CalendarText','Images/CalendarTextRolloverGif.gif');return true" onmouseout="changeImages('CalendarText','Images/CalendarTextGif.gif');return true" href="#"><img id="CalendarText" src="Images/CalendarTextGif.gif" alt="" name="CalendarText" height="22" width="131" border="0" /></a></div>
<div style="position:absolute;top:80px;left:128px;width:69px;height:317px;">
<table>
<tr>
<td>
<div align="center">
<a href="javascript:prevSet()"><img class="nobo" src="Images/prevSet.gif" alt="Previous Set" style="border-style: none" /> </a><br />
</div>
</td>
</tr>
<tr>
<td><a href="javascript:setPic(-2)"><img id="thumbnail1" src="Images/dot.gif" alt="" name="thumbnail1" style="border-style: none" /> </a></td>
</tr>
<tr>
<td><a href="javascript:setPic(-1)"><img id="thumbnail2" src="Images/dot.gif" alt="" name="thumbnail2" style="border-style: none" /> </a></td>
</tr>
<tr>
<td><a href="javascript:setPic(0)"><img id="thumbnail3" src="Images/thumbnails/Image1.png" alt="" name="thumbnail3" style="border-style: none" /> </a></td>
</tr>
<tr>
<td><a href="javascript:setPic(1)"><img id="thumbnail4" src="Images/thumbnails/Image2.png" alt="" name="thumbnail4" style="border-style: none" /> </a></td>
</tr>
<tr>
<td><a href="javascript:setPic(2)"><img id="thumbnail5" src="Images/thumbnails/Image2.png" alt="" name="thumbnail5" style="border-style: none" /> </a></td>
</tr>
<tr>
<td>
<div align="center">
<a href="javascript:nextSet()"><img class="nobo" src="Images/nextSet.gif" alt="Next" style="border-style: none" /> </a><br />
</div>
</td>
</tr>
</table>
</div>
<div style="position:absolute;top:97px;left:280px;width:565px;height:386px;">
<img id="BigPic" src="Images/Photography/Start.png" alt="Enforcer" name="BigPic" /></div>
<csnopos>
<cspos xpos="80" xpos="0">
<script type="text/javascript" language="javascript">
filenames = new Array (
"Image1.png",
"Image2.png",
"Image2.png",
"Image4.png",
"Image5.png" )
descriptions = new Array (
"Image1.png",
"Image2.png",
"Image3.png",
"Image4.png",
"Image5.png" )
picCount = filenames.length;
index = 0;
function getPic(i) {
return filenames[i];
}
function getDesc(i) {
return descriptions[i];
}
function setPic(thumb) {
if ( index + thumb >= 0 && index + thumb < picCount ) {
index = index + thumb;
var mainPic = document.getElementById('BigPic');
newPic = "Images/Photography/" + getPic(index);
mainPic.src = newPic;
updateThumbs();
}
}
function prevPic() {
if ( index > 0 ) {
index--;
updateThumbs();
}
}
function nextPic() {
if ( index < picCount ) {
index++;
updateThumbs();
}
}
function prevSet() {
if ( index > 5 ) {
index = index - 5;
} else {
index = 3;
}
updateThumbs();
}
function nextSet() {
if ( index < picCount - 5 ) {
index = index + 5;
} else {
index = piccount - 3;
}
updateThumbs();
}
function first() {
index = 2;
updateThumbs();
}
function last() {
index = picCount - 4;
updateThumbs();
}
function updateThumbs() {
for ( i = 1; i < 6; i++ ) {
var thumbPic = document.getElementById('thumbnail' + i);
thumbindex = index + (i - 3);
if ( thumbindex >= 0 && thumbindex < picCount ) {
newPic = "Images/thumbnails/" + getPic(thumbindex);
} else {
newPic = "Images/dot.gif";
}
thumbPic.src = newPic;
}
}
</script>
You can find this in practice he https://campfireditties2.sslpowered....onsPeople.html Any help would be tremendously appreciated. Hope someone can help me please... I'm trying to find the best way to place an image slideshow (continual loop, no stopping etc) on my home page. I've tried a few what look like good JavaScript versions, which I cannot get to work properly - seem to conflict with other JavaScripts running on the same page. Does anyone have any ideas? Or is there a way to do this without using JavaScript (or Flash)? I'm using Joomla CMS if that helps/makes a difference... Thanks in advance! Hello .. First I must say "Excuse me" if I posted in a wrong room...... I searched many threads for some information regarding the best programming technologies for displaying an image slideshow on a home page. Please let me know if you have any do's or dont's related to this. With some many technologies available to display an image slideshow I want to make sure I choose the right method so SE's dont stumble when indexing my site. Thank You ! 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? 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! 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 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??? 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 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 |
|||||||