I have an image that contains two links; however, you cannot tell unless you happen to mouseover the right area and a message appears "Click here..." How do I highlight the area so that the user knows the links are there?
View 2 RepliesHighlighting a single Link on MouseOver with CSS or JS is simple. But now I have several Links spread over a table. If I have MouseOver on one of those links I also want to have a few of the other links also highlighted because they are related. How would I go about and do that?
View 12 Replies View RelatedI have an image wrapped inside a link tag.<a href="somepage.html"><img id="content" src="img/some.gif" /></a>
I want this .click target to be the link: $('a').click(function(e){
Instead, the target returned is the image [HTMLImageElement].
I have tried using closest()and currentTarget:
But they all still return the image, not the link.
My mouseover links here: [url] is there a way to "highlight" the links while the slideshow starts, so that people know the links use the map?
View 1 Replies View RelatedI've a page divided into three frames,
----------------------------------------
|wwwwwwwwwwwwwwwwwwwwwwww|
|wwwwwwwwHeaderwwwwwwwwwwww|
----------------------------------------
|wwww|wwwwwwwwwwwwwwwwwwww|
|wwww|wwwwwwwwwwwwwwwwwwww|
| Leftw|wwwwwwwMain wwwwwwwwww|
|wwww|wwwwwwwwwwwwwwwwwwww|
|wwww|wwwwwwwwwwwwwwwwwwww|
-----------------------------------------
The menu is in "Header" part, i want to highlight the selected image in "Header" when it is clicked.
When the image is clicked the related page is displayed in the "Main".
Onmouse over the highlighted image is displayed and Onmouseout the non-highlighted image is displayed.
I've tried by removing the Onmouseout event but that keep showing the highlighted image of Onmouseover event.
I created an image gallery. The way it works, I click on a thumbnail and it displays the image - This works fine. I'm now trying to use onfocus to highlight the thumbnail that I clicked on. It highlights the thumbnail but when I click on a different thumbnail the first one stays focused and the second is focused also. I want it to unfocus if I click on a different thumbnail. Can somebody give me some advice on what I should do? I'm not that great with Javascript but I got this far.
View 4 Replies View RelatedGot this below code for a page im working on, what you'll notice is that when you hover over 'order' a sub menu appears,
How do I make the 'order' remain highlight while Im hovering over the sub menus.
I have say 12 pics on a page, in 3 rows of 4. The rows of pics are there so that a choice can be made from each row and I'm using a function <script>
var highlight_color = '#FF0033'; function toggle_highlight(id) { var images = document.getElementsByTagName('img'); for (var i = 0; i < images.length; i++) { var image = images[i]; image.style.borderColor = image.id == id ? highlight_color : 'white'; } } </script>
to toggle a border colour change so that you can see what was chosen from each row. The function I have used is fine in that it works, but I can only choose one picture and have the border changed, then if I click on another row the first border that changed obviously changes back and the new selection is highlighted. I don't really know where to go from here.
I have a question about this image cube [URL]. I would like to make it like this [URL]. How to make that thumbnail scroller with highlighting function and linked properly to the cube.
View 2 Replies View RelatedI have a page on which a random image loads. Each image needs an accompanying image map to take you to the appropriate link. How do I make the appropriate image map links load? Here is my code so far, which works fine.
myStrip = new Array("images/hstrip_1.jpg","images/hstrip_2.jpg");
imgCt = myStrip.length;
function chooseStrip() {
if (document.images) {
randomNum = Math.floor((Math.random() * imgCt));
document.strip.src = myStrip[randomNum];
}
}
Im using this code to rotate images on refresh but dont know how to add links to each image, can't anyone help?
View 3 Replies View RelatedWhen you lick it it will opn up a url in a window. then in 10 seconds it will open up another url in another window automatically.
View 4 Replies View RelatedIm trying to make a navagation menu with images that need to be changed when someone hovers over the child category.
So lets say I have a menu that looks like this:
<img src="notactiveimagemenu1.jpg" alt="">
<ul id="menu1">
<li>link</li>
<li>link</li>
[Code]....
I know I could add onmouseover events to each li item and changing the src of the category. But Im trying to find a better solution. And I think I should be able to use document.getElementById(id).onmouseover = function() for that.
note I know I could use jquery to do all of this very easy but I consider this practice because I don't know that much javascript.
I have 3 smaller thumbnail images and when I click on any of them, the resulting image displays in the larger image space.
The tricky part is that I want the larger image to become a link that changes, depending on which image is displaying. (I don't want the little images to be links.)
Click here [url] for a visual to explain what I am wanting to do.
Here is what I have for script...but I can't figure out the links...This script works fine, but I can't figure out how to make the larger image have 3 separate links, depending on which image is displaying in it.
im looking for an image rotator script with links, so every time the page is refreshed a new random image is displayed. The thing is, i need a script that doesnt have the location of the images in the script.I need a script like the current google adsense script, no advertisement links or locations are displayed.
View 2 Replies View RelatedI've got the following script to trace as far as defining the p variable, but then the script apperas to choke. I'm thinking my insertBefore logic is incorrect and wondered if someone can help me out.I'm basically trying to attach an icon inside the a tags within the 'content' container, in front of the a tag text to achieve something like
<a href=""><img src="icon.gif">Text</a> where as the moment the document just has <a href="">Text</a>
Code:
function createElement(parent, target){
var c = document.createElement('img');
c.src = 'icon.gif';
[code]....
I did a search but didn't find this so if I missed the thread I apologize. I want to show 3 images with a link to the individual dog's page. The images are rotating just fine but none of them are clickable. I'm new to Javascript and took a simple image rotator script and then edited it.
View 2 Replies View RelatedI found, after some googling, a js that shows broken image links in FF. I wonder if its possible to alter it so that the script displays the broken link image in the same size as the original image is in. Now it makes it in to 80x80px [code]...
View 6 Replies View RelatedI use the following script for my rotating images with links and would like to know if there is a way to have the links display in a new window code...
View 1 Replies View RelatedI've built this DreamWeaver template for a website, the links I am using are Jpegs that, when rolled over, change to another Jpeg with a different color scheme. When I preview the template in any browser on in DreamWeaver's Live View, everything appears to be working fine.
Here's the problem: When I make an HTML page based on the template and attempt to view that HTML page, I get the following results:
Firefox: Nothing happens when rolling over IE: ActiveX prompt, upon allowing unblocked content I'll go over a button, at which point it switches to that "I can't find the image" image.
DW Live View: Same as Firefox
I can't think of anything that would make that happen, here is the code I am using.
For the button image:
<a href="about_one.html"><img src="images/buttons/btnAbout.jpg" width="75" height="40" id="btnAbout" onmouseover="changeAboutLink()" onmouseout="revertAboutLink()" /></a>
[Code]....
What I have is a site with about 10 pictures, each of these pictures needs to be randomly pulled from folders, each picture slot will have its own folder, due to it being categorized. When the picture is clicked i need it to open a new page with the document associated to the picture. Is there a way to do this without having to rewrite the code every time? Because as there are new documents added at the end of each week.Unfortunately the server I use doesn't support PHP, but if it has to be done in PHP I can switch.Like I said though I haven't messed around with web design in a long time
View 3 Replies View RelatedI have a page in which I need multiple JavaScipt popups. That part works fine, but the popup links, which are images, won't align horizontally. Instead, they line up vertically. I've tried putting them in tables but then the JavaScript doesn't work.
Here's the code for the JavaScript script: Code:
I'm relatively new to jQuery, and I'm trying to figure out how to create a restaurant menu, that when you click on an item on this menu, an image and description will show on the page. [URL]I've looked through several plugins but cannot find this exact solution. Can anyone please point me in the right direction?
View 2 Replies View RelatedI'm optimistically hoping that someone has already created a plugin for my desired effect, I think I've seen it in the past but can't recall where..
Essentially, I have a 'website'/'book' being loaded by an iOS app in a uiwebview 'browser', which uses floating images for controls (back/contents/next)
I would really like for the controls to fade out when no scrolling has occurred for say 5 seconds, and fade back in when the screen is touched or scrolled.
Here is a script I found which works well for randomly selecting a static image when loading/refreshing a page, and allows captions for the images. I need this to also have the images link to other pages. I lack the javascript ability to do so.
Code:
<!DOCTYPE -don't forget to use one of these!
<head>
<title></title>
[code]....
i downloaded Anylink drop down menu from dynamicdrive.com. i am able to get it to work with text links, but they dont show you how to set it up for image links. here is the page im talking about.
[URL]
here is the css to my page that just contains the regular links dropdown.
@charset "utf-8";
/* CSS Document */
body {
margin: 0; /* clear for browsers */
[Code]....