I have been spending all morning trying different solutions. I'm trying to change two images ('bigpic' and 'desc') when someone clicks on a respective thumbnail. I have the swap working for 'bigpic' but cannot add the swap for 'desc' and get it to work. I used the Insert Image Object from Dreamweaver since I am not a Javascript coder and I've been looking through books and online and cannot find the answer. Here is the javascript code I have in the head:
<script type="text/javascript">
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
I am not very well versed in js, but am attempting to figure this out. (Gotta start somewhere, right?) I want this to be unobtrusive js, if possible with no js specifics in the html (though additional or changes to classes/IDs would be fine). I've started with PPK's mouseover script, which is working just fine. To this, I want to add some onclick behaviors. Code:
I'm trying to create a portfolio website in which I have multiple galleries showing different work on the same page . Each to work separately and change the default image on click. I have seen it work here: h[URL]
I was able to follow this: [URL] but then couldn't duplicate it.
I have built a webpage that is all one template and the use of an iframe to change the content and not reload the page graphics every time. The way the page is laid out is a background image in the farthest back table behind another table of a background image that is transparent and over lays the bottom table image.
I want the menu buttons; with the existing rollover image for them alone, to change the bottom layer background image "on click". The only code sources i have found will swap images in the same table area and not to any image existing in the entire document.
i am going to add thumbnail images on the right side of this page[URL]...like found on this page[URL]... also i am going to give the arrows the ability to navigate through the images i asked for advice in a different forum and was told that the image swaps i have in ggallen.html should not be inline as it clogs up the page...makes sense. i would like to know the best way to add the image swap function, or whatever is best for the job, to the thumbnails. also i would guess there is a more concise way of achieving the navigational behavior for the arrows than making separate divs which are shown/ hid on click.
Does anyone know of a good MIT-Licensed, or MIT-style image swap and disjointed rollover solution? All the ones I've seen are either GPL or personal-use only. The examples of img replacement scripts I've seen on stackoverflow are either only for personal use (I believe every example on the site is personal only, unless stated?), or too narrow in scope.
Any help would be great as the docs.jquery.com site has great demos on almost everything except how to swap images. I don't mind if its a block of code or a plugin, although preferrably something small and simple would be great.
It sounds like a big ask, but I thought I would ask as this place is super-friendly, unlike some of the other js libraries' forums' I've been to.
I am trying to set the onclick event for images through a function, but the event is triggered as soon the page loads, then will not work when the image is clicked. Can anyone suggest what is wrong? It is happening in both IE6 and Firefox --------------------------------------------------------------------------- window.onload = fnNewWindowLinks;
function fnNewWindowLinks() { for (var intLinks=0; intLinks<document.links.length; intLinks++) { if (document.links[intLinks].className == "picture") { document.links[intLinks].onClick = alert("Clicked"); } } } ---------------------------------------------------------------------------
I am currently building a memory game for an assignment. I guess you can figure out what it's supposed to do. Anyway i am having problems assigning onclick events for my images, as the way i've learned b4 doesn't work. The issue is this code snippet, everything else works or is in a working state at least;
I'm new to the forums, so if i post anything wrong let me know. I'm trying to use links to hide all the images, and show just ones from a certain category. I've used the img name attribute to group them and tried to do a function that shows only one img.
<script language="javascript"> function showone(x) { document.getElementByName('a').style.display='none'; document.getElementByName('b').style.display='none'; document.getElementByName('c').style.display='none';
[Code]...
except the links don't work like they should, and I can't figure out why. I'm an idiot with javascript, so if feel free to make fun of me, and if anyone knows how to get this simple function to work,
http:[url]............1) In the events.js-file where you write the longer text part for the tooltip, is it possible to include images somehow for each event within the end of the tooltip?I thinkt that would make the activities look a bit more interesting to read about.
2) When I click on any yellow event in the calendar, it changes the text to the right. Fine with that. But is it possible to use onclick as a double function?So that when I click on "START" (bottom left of the calendar) after having pressed any yellow event, it will not only take me back to the right month but also take me back to the start text?
I have this little snippet of code that swaps a toggle image for news for a plus or minus sign showing if the div is open or closed. This code has worked before but i made a couple modifications today and it stopped working unexpectedly and i'm not sure why its failing. I am presetting the div tag with a plus sign with css and then modifying it with javascript. The problem i am having is that when the div tag has been opened it does not swap the image to min.gif anylonger. It remains max.gif.
I have created a long list of items. For each item, there is 1 image. In my case, I use the same image each time.
I would like to use JS to allow users to check an item by clicking on it. Please note, I am not using radio buttons or any other forms.
This is my JS function:
It is triggered using this:
It works for each image. It switches to 2.png when a user clicks on each instance of that image. But how do you make sure it switches back to 1.png on the next click, and so on, effectively creating a switch for multiple instances of the same image?
What i want is just 3 images (representing the currency flag) I have tried just simply using the onclick="" but im guessing i will need to create a JS function?
I have a html page with a lot of thumbnails. The idea is that when the user clicks on an image the onClick event is to display another detailed form and deliver to that form the name of the image in a variable. In the detailed php-form there is a query to MySQL to retrieve a record. The record will be retrieved by a Query based on the name of the picture. Apparently the PHP cannot do the job. I had an idea to make the thumbnail page as a form and to use use a hidden field with the thummnail name which should be carried on with the $_POST array through the submit button but i do not want to have a submit button. The more elegant way is just by clicking the picture the detailed page is opened and the variable is transferred where my php code can make use of the variable for the query. I have never used java before so you have to excuse for the lack of knowledge.
I am new to JavaScript and have been plugging away at it trying build a menu for site I am developing. My colleague has suggested I use Flash, which I could, but I think it is unnecessary and JavaScript is ideal for this use.
I have been building a menu that has a sub menu that appears below all of the main menu items. I have got this working and will include the code I used to do this below.
Now I want to change the button image so that it is visible which sub-menu the items that appear below belong to. Code:
which was very helpful and with some playing around I can now get my existing menu to complete part of my task. But I have 4 menu items and therefore need to use a "var" command to allow me to define different button images for different menus. Code:
I am new to javascript, and am having an issue, which I'm sure is elementary.. I found a script for expandable content, it suffices fine. As it stands, the script toggles images onclick. For example, whence the menu is collapsed, it displays "plus.gif" next to it, and when the menu is expanded, it displays "minus.gif" next to it.
Basically, what I would like to know is, thus: how would I change it to display text icons next to it? For example, in place of "plus.gif" I should like it to display "+" as actual text. I've dredged a number of places, however, I've found nothing. Furthermore, I cannot figure out how to do it.
I have 5 divs with class .myImage and i set onClick event to all images, firebug tell's me that i have used img varialbe more then one times, can i do this var = $("img", this)?
I want to make it so that when I click on something, it changes what document.onclick does.
This is a simplified version of what I'm trying to do:
Code: <div id="clickme" onclick="document.onclick = function(){ alert ('This should not be alerted on the first click'); }">Click here</div>
However, as you'll notice, the alert box shows up on the first click as well. The only way I have been able to get around this behaviour is to have the first onclick execute a timer that will then set the document.onclick after 1ms, however this seems very messy to me.
how to change images based on action. Even clicking changed images should do respective actions. and while displaying only one image at a time sholud get displayed. I am using three images for a single column of a table in Jsp. Code:
What I'm looking to do is have a folder of images that I have show up on my website.I'm also looking to pull from this folder up to 6 or 7 times on the same page w/ randomized pictures that do not repeat.Finally, I'm looking to be able to size and name these images based on which image randomly pulls. b/c it's not grabbing the images.
I have to do a slideshow with images of different widths... am using cycle plugin, which I like very much... I have a little test slideshow here, http:[url]....it's not centering imgs in containing div (I made div width of widest image.. this will work for my situation, in which imgs will be hard-coded..)if you inspect img element in firebug (#slideshow img), it shows that the plugin adds a style of position: absolute; top: 0px; left: 0px .to the img; why does the plugin do this.. how can I center the images in containing div...
I need to refresh multiple images on my site. So every time the page gets refreshed the images need to change. It worked fine with the script below, but this is only related to 1 image
I tried to copy the script and change the "ID's" but this does not do the job.
I am trying to make different images hover over a table of sliced images when you mouse over a particular image. ex. mouse over image 1 = have image 1.1 hover over entire table of images in spot A; mouse over image 2 = have image 2.2 hover over entire table of images in spot B....ect. what i have so far only allows me to mouse over image 1 and have image 1.1 hover over entire table in spot A. Any time i try to move forward with more div's on other images it just jacks everything up.
Iīve just launch my website-portfolio, well itīs not yet the final version but it is almost and despite I am satisfied with the final result Iīve detected a really strange bug that only happens sometimes. The thing is when the first introduction Slide appears (the one with the hand-made drawings), sometimes the images shrink from the normal size to small tiny images. This doesnīt happen always and if you refresh the page it disappears.
Follow the link to the page were the bug happens - [url]. I'm using jquery cycle plugin, check it out.
I am working on a small gadget which downloads a series of images from the web and displays the images in a loop. However i am having trouble saving the xmlhttprequest to a file to use later in an array. I have read that it should be easy to save the .png using Scripting.filesystemobject but have been unable to find any information on how to do it.
