I have been trying to develop a script that creates a slideshow that adds hyperlinks to the images.
I'm a beginner at Javascript, so I've made a bastardisation of 3 different scripts I've found that, by my reckoning, should work.
This is the slideshow code:
I know that for the most part, this script works. It was only when I tried to add the component that involved adding a hyperlink that it broke. The bit of code in the HTML that it directly affects is <div id="view_portfolio"> </div>
Does anyone know why the javascript doesn't work? I have a feeling it's because I haven't applied the id tag in the HTML properly, but I don't know what exactly is wrong about it.
The gallery I have made so far is at [url], except that at the moment, the images don't show. I've attached the javascript & html code.
I'm working on a site for a college javascript class, but I want to do a little bit more with my class site. I have a very simple slideshow set up( as a pop-up), but I want the images to be clickable and take the person to a site. Specifically, I have images for books on amazon, and I want the person to be able to click on the images and be taken to the specific page where the book is sold.
I'll post what I have, I was wondering what would be the best way to integrate it into my slideshow.
<body onblur="self.close()"> <div style="text-align: center;"> <p>If you like this site, you will love these<br /> wonderful books. Click <a href="http://www.amazon.com">here</a>
I have been using this sideshow example which works great but I want to be able to click on the slideshow picture to take me to another link (hyperlink)
I also wanted to have links next to the slidehsow which would go to a certain picture in the slideshow for example by pressing link "go to picture 3" it would scroll automatically to picture 3 in the slideshow
I have been using examples from: [URL] this but I am willing to change to another version if I can't do that with this slideshow scrit
I am using a javascript slideshow called fadeshow. (Main code below).
I am wondering if there is a way to have thumbnail support, so I could allow the users to click on a thumbnail and have fadeshow go to that photo in the array. I have gotten a next / previous button working but also would like to add thumbnails.
How would I write an a href link to specify an image in the array?
Here is my issue: I have made a VERY SIMPLE slide show and it works perfectly. However, Now I want to add a fade in and out effect to the code. I have seen this done with the CSS opacity(alpha) and that seems to be the simplist way. However, I am having trouble fitting this into my code.
var step=1 function switchImg() { if (!document.images) return
I am using a simple slideshow script. I have a div on top of the image that contains text. I'd like the slide to forward to the next slide in the slideshow when the user clicks on that div (#slideshow-caption). Here's the code with the .click call. If you see anything else funky with the script, let me know.
function slideShow(speed) { //append a LI item to the UL list for displaying caption $j('ul.slideshow').append('<li id="slideshow-caption" class="caption"><div class="slideshow-caption-container"><h3></h3><p></p></div></li>');
I found a jquery image slideshow script but the images have no links to them. When I manually add the links to the image urls, these work only in IE - when I click next, the picture updates and is linked to the correct URL. In other browsers (Firefox, Chrome..), the last url becomes the clickable link for all the images. I have tried to use the .wrap option and I'm sure I'm on the right track, except I have 4 images and I want it to go to 4 different urls.it sought of works, but only the first url is picked up and becomes the link for all the images.How can I get the link reference for the url to iterate with the original loop of the image?
I'm trying to add a fade effect between slideshow transitions. The script I'm building from is the Rich HTML Slideshow script which appears below.
The slides that rotate are wrapped in <div> tags with a class of "dyncontent" and I've managed to make the slideshow transition just fine, but not with any kind of fade effect. It just "snaps" from one slide to the next.
<script type="text/javascript"> if (document.all || document.getElementById){ //if IE4 or NS6+ document.write('<style type="text/css"> ')
I found a piece of code that helps me out a lot at [URL] It allows an image to crossfade into another, into another, etc.
I'd like to be able to crossfade an image, with a text caption underneath it, to crossfade into a different image with different text, into another, etc.
I think doing this may have something to do with putting the image and caption into a <div>, and then changing the code to swap the first <div> into the next, into the next.
The code identifies the images as 1.jpg, 2.jpg, 3.jpg, etc. It would be awesome if the captions could come from 1.txt, 2.txt, 3.txt, etc.
If Javascript can't call up .txt files, then the captions could be put inside the current web page into a table that is set to be hidden (display: none).
The reason I want to use Javascript is because I do not wish to use anything that will make visitors have to have additional software (like Java or Flash). Additionally, it is not a problem if they have Javascrpt disabled, because then they'll just see the first image with the first caption, which is fine. I can't use anything like PHP or PERL because I have very little control over the server.
Here is the original code:
========================================================== Script: JavaScript Cross-Browser SlideShow Script With Cross-Fade Effect between Images Adjustable Timing and Unlimited Images Function: Displays images continuously in a slideshow
I spent a while figuring out how to get a Js slideshow to work on a website and then my client asked me to add a pause, play, back and forward button to it. I haven't had any luck trying to add one so I was wondering if anyone could lend me a hand.
So Im trying to create a slideshow with thumbnails the user can scroll through and use to navigate the slideshow. I'm a big fan of cycle so I wanted to use that as my main slideshow component and was planning on using jcarousel for the pager. So far it works great in Firefox, Chrome, and Safari, yet in IE the thumbnails are not loading. I'm guessing it has something to do with how the images in the pager are generated and then jcarousel just isnt proccessing that in IE but I 'm not sure. I feel like I'm very close to getting this slideshow to work, yet I need to figure out why it is failing in IE.
Basically I have a WinXP machine (SP1 with all web updates don't want to upgrade to SP2 until this issue is resolved) and IE 6 (all web updates).
If I am on a secure (https) site none of the hyperlinks seem to work. As I mouseover the relevant links are shown in the status bar (ie another page or site), but when I click on these links nothing happens at all. Its as if something is blocking the process of firing these links. NOTE: I can click on form buttons OK and the exact same links work fine on 3 other machines that I have.
I'm developing a website where a visistor does not have to use the mouse. All he has to do is use the Tab-key or key-combinations to jump to specific hyperlinks (containing accesskeys). Next, he presses the Enter key to follow the hyperlink.
My question is: is it possible to change color of the hyperlink when a hyperlink get the focus. I do not only want to see the dotted line, I want the hyperlink to lighten up.
i want to open all links on my website in a div tag like facebook.com or esl.eu. how can i do this ?i want to make a chatbar like facebook or esl.eu and this bar should not reload anytime if i click on an link on my website.
<body> <div id="chatbar"></div> <--- should not be reloadet <div id="content"><--- website with all links in it <a href="link"></a> <--- should open in <div id="content"> without reaload the hole website</div></body>
I would like to create a series of checkboxes that would define a particular entity by it's attributes. For example let's say I have some check boxes that say
age limit 18+ [X] Hip Hop [ ] Electronica Dance [X] Least expensive [ ] [moderately expensive [ ]
These selections above will activate, deactivate, highlight, or bold selections below
Club one Club two Club three
And when unchecked all the links are unfiltered Etc...
When these check boxes are checked in any combination it would remove the hyperlink or highlight/bold the hyperlink of whatever is filtered Would really like someone to point me in the right direction on how to structure this.
I am looking for a js script that will monitor when a hyperlink is clicked and force that link into a new window or native application.
If the link is to a different web page, the link should open in a new window. If the link is a word document, the document should open in word or the default editor. If the link is within the same page, such as a back to top or bookmark, the link should stay on the page and simply go to the desired location.
I am using a simple prototype slideshow and a more comprehensive jquery slideshow on my website.When these are used on the same webpage on my website there appears to be a collision: (For example)Code:element.attachEvent is not a function[Break on this error] element.attachEvent("on" + actualEventName, responder); How can I avoid the conflict without reverting to a new slideshow?
I am just starting to use the DOM to do some more advanced javascripting so please be patient with my question if it is an ignorant question.
I would like to use the DOM to dynamically create an html table via javascript. While that table is being dynamically created in a javascript function I would like to dynamically insert text and a hyperlink with an image into each cell.
I got pretty far on my own. I was able to dynamically create a table and insert a string into each cell. However, I was not able to use the DOM to insert a hyperlink into each cell. I tried adding it as a new text node and got the text of a link rather then a link. I then tried adding and setting an anchor element but I got nothing. Code:
I'm trying to select all hyperlinks in a webpage, and making the text all CAPS as an exercise. However, simply selecting $('a[href]') selects ALL hyperlinks, including hidden ones, pushing the text to the front. My css-fu is not very good, this is what I have so far.
$('a[href]').each(function(index,element){ if (!element.parents().css('display:none'){ element.text(element.text().toUpperCase()); } };
I have a collection of hyperlinks in a web page and I need to know how I can do the following:
1) When I click a hyperlink, change the Class of all hyperlinks that have the same link phrase text (or value).I have tried this but it doesn't seem to work (it was a bit of a guess!):
