I have a bunch of thumb nails that will be at full opacity when a user gets to the page. Users will be able to select their favorite. What I want to have happen is when a user selects their first favorite all of the there thumbnails will be lowered in opacity then when they select other favorites the opacity of that thumbnail will be brought to full. Each thumbnail is in a div. I am at a complete lose on how I can achieve this.
Is there a cross browser way to change the opacity of an image? I have found a way that works for IE and Firefox but would like it to work in Safari and Opera as well.
I've got this script which effectively should change the clicked link's opacity to full and its siblings' opacity to 0.6. The only part that works though is the changing the text color to black. Here's the script:
I finally got IE to clear up its text after changing opacity with javascript, but it looks like Safari is suffering from the same issue.When I have javascript change the opacity of a div layer with text in it back to 100, It looks distorted in Safari only.My fix for IE was document.getElementById('mydiv').style. remove Attribute('filter')So thought there might be something like that for safari.
I know it would have usability issues but it would be a nice extra for a site I'm building. Circles placed around the page that could do any or all of the following:
1) fade in and out 2) grow and shrink 3) change colors 4) move around
And all without having to mouse-over. If not with CSS perhaps javascript?
I'm adding a sub menu to my portfolio page that will allow a user to filter the types of projects they want to see, but I'm not really sure how to approach this. I have a variety of web design and motion graphics projects all on the same page, and I want the user to be able to "uncheck" one category or the other, and when they do, all the divs for the unchecked category will fade out. This is the page: [URL] Does that make sense? What I'm thinking of doing is applying a unique ID to the different categories, then build a little JS that will change the opacity of those specific IDs somehow. I am not a JS ninja though, and I'm thinking there is probably a more efficient way.
I have a script that makes opacity of images change when it's called, but the problem is, in IE work perfectly, but not in mozilla. Here's the script : Code: function submitkeytest(){ showbanners = true; multy = false; x = 0; while (x<2){ document.getElementById('b'+x).style.filter = "alpha(opacity=100)"; document.getElementById('b'+x).style.MozOpacity = 100; document.getElementById('b'+x).style.opacity = 100; if(document.getElementById('b'+x).name.indexOf(document.getElementById('keyfield').value)<=-1){ document.getElementById('b'+x).style.filter = "alpha(opacity=20)"; document.getElementById('b'+x).style.MozOpacity = 20; document.getElementById('b'+x).style.opacity = 20; } x++; }} What exactly did I do wrong?
I am using the following function in order to change an image opacity on a mouseover and mouseout. This function works fine but does not handle a onClick. What I mean by this is...... How can I create/alter the function to handle an onclick? I want to be able to click on an image (one of many) and have that image opacity change to 50%. There are other similar images whose opacity would need to remain at 100%. If one of those are clicked, that images opacity would then change, and the previous would restore to original value of 100% I thought about passing the clicked images id to the function but I can't find a way to compare an image id VS a passed image id.
I'm beginner, and there is a task in exam to change inner content of the second child node. Can't get,maybe link to an article how to do it, because I can't find anything in my study book;:mad: edit: is this correct?
function SetUpTranslation() { var phrases = document.getElementsByTagName('p'); for (var i=0; i < p.attributes.length; i++){ phrases.secondNode.innerHTML=french[i]; element.onclick=swapFE(phrases.secondNode); element.onmouseup=swapFE(phrases.secondNode); } }
I'm building a website with a image menu like accordion, using jquery+easing+kwicks [URL]ith CSS, I can change the opacity of the element hovered (the opened kwick), but I'm looking to someway to change the opacity of the inactive kwicks (the images that close when you open a hovered image).I tried to do it with css, or hacking kwicks plugin, but I couldn't make it.
I need to change the position for a group as reaction for a mouse movement so I wrote this: this.dragged.attr('transform').baseVal.getItem(0).setTranslate(x, y) But this does not integrate well with the animation this.dragged.animate({svgTransform:'translate('+(-x)+' '+(-y)+')'},delay)
On my website I've got a simple animated .gif I want to play each time someone clicks a link on the menu bar. The problem is that while the image changes successfully, the webpage changes too quickly so the animated.gif won't play.
I'm assuming this has something to do with setTimeout though I'm too much of a noob at Java to get this right.
there is some kind of flash rotator on the home page. This is my code attempt to move between preloaded swf animations using javascript. I've tried giving id of the object or embed but this won't help. Of course this is not that simple and the code isn't working. My intent is to have animation change when clicking the next button.
<html> <head> <script type="text/javascript"> var flashNumber = 0; var items = 3; [Code]....
I have a button which is animated with a rollover effect, obtained through jQuery of course. I wish to open a lightbox clicking that button and I tried with a simple, self-made lightbox and with FancyBox but in either case the lightbox is displayed without animation.I post the code for my buttons and the lightboxHTML for buttons:
I've been messing with this code to make a fade in animation with setTimout. The only thing is addition isn't working on the fade in. A subtraction on a negative works though. This seems strange to me.
changeit.style.opacity -= -0.01; works but when it's changed to changeit.style.opacity += 0.01; there's no fade in. It's the only thing I change. My intuition says to me it should work with addition, but maybe there's something I'm not understanding.
<html>
changeit.style.opacity -= -0.01; if this is set to changeit.style.opacity += 0.01; it doesn't work. What?
Of course this is all just for Firefox for now. If I put this in something useful I'll change it so it'll work in other browsers later.
I've been trying to get opacity reporting working in IE 5.5 but the Microsoft documentation does seem to work as I interpret it even though this documentation page seems have been written for IE 5.5
In IE I have a routine that dynamically assigns objects' opacity. This works fine for some elements but not for others. It works for buttons and inputs but not for img, span and select.
This is the line that sets opacity from a loop through all elements:
I would like to set opacity of some element to 0 through JavaScript, using GetElementById function. This is my short code inside body of HTML: <script> document.getElementById("element").style.opacity="0"; </script> <div id="element"> noopacity </div> It doesn't seem to work, what am I doing wrong?
I want to amke something fade out, if and only if it is already set at 100% opacity.
I need to make a function that will allow me to do this.
Here is my current code:
//Time=millisecond Start and End = Amount of Opac to start with. Id = which div to affect function opacity(id, Start, End, time) { //frame speed here var speed = Math.round(time / 100); var timer = 0;
// if(Start > End) { for(i = Start; i >= End; i--) { setTimeout("Opac(" + i + ",'" + id + "')",(timer * speed)); timer++; } } else if(Start < End) { for(i = Start; i <= End; i++) { setTimeout("Opac(" + i + ",'" + id + "')",(timer * speed)); timer++; } } }
I've got two problems with these functions:[code]The first is that they fade in and out as expected, unless I mouse over any of the text in the div. Then the fadein and fadeout functions seem to compete with each other.The second is that showcount keeps getting set to undefined, so it never gets to 4, where upon fadeout should return without fading the div into the background.I should say that I believe the first problem has to do with mouseover seeing the html as a separate entity from the div, but that seems odd because it's a child of the div!