Text Looks Like Crap / Distorted In Safari After Change Of Opacity
May 11, 2010
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.
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 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.
Click on the first image. then navigate through the ligthbox using 'Next' button.Sometimes the images appears distorted.Is is due to the Lightbox ajax rendering of the images?
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 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.
but this isn't quite optimal, cause if the user mouses out, it changes back to fade, and the user can't quite see what he's entering. So I would like the div to have opacity=1 when one of the textfields in it is active and opacity=0 when it's not. Is there a way to do that?
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 just can't win with this site. Everytime I fix a problem, another arises.[URl].... If you view the site through IE, within the 'Upcoming Shows' i/frame, you will see some scrolling text (bottom to top).
The page that holds the code is www.mrbizness.com.au/updates.asp (the iframce pulls the code)
The problem is, it only seems to work in IE. When you view it in FF or Safari, instead of scrolling the text, it just displays the code. I've been awake for far too many hours, and consumed WAY too much PEPSI, so my eyes just aren't working anymore.
Anybody have any ideas why it would be doing this? I really want to get the site finished and be done with it...I think it's posessed.
i am using two textareas for editing by tinymce, its working fine in ie and ff but in safari it is opening the first textarea editor only. This was my code.
tinyMCE.init({ // General options mode : "textareas", //mode : "exact", elements : "description,pedigree", theme : "advanced", [Code]....
I'm relatively new to jQuery and wrote a simple script that hides a block of text and displays a read more link that when clicked shows the hidden text. Everything works fine except in Safari where the hidden text is initially displayed for a second or so before being hidden. I did some research and I did run into a few posts about similar Safari bugs but no resolution has worked for me yet.
based on selection of radio button, i want to change the text box to enable and disable. And additionally, how to set if i enter a value in textbox1 then calculating something and display the result in textbox2 that to on key up.. not on form submitting.
I'm a real newbie with Javascript, but I'm having fun. I just bought the book, "Simply Javascript" (have only just cracked it so far). I'm reasonably familiar with PHP (I use a lot of it to do simple things). I'm a Web desinger and do custom CSS Websites (I'm fairly new to that too couple of years or more working with CSS and I've never done a table based layout.
[Code]...
But when the button is clicked, nothing will call the showCaption() function again, and I can't figure out how to call that function as the images advance. I have tried a lot of things with a lot of weird results, one being the tne next caption will display in a blank browser window, without the Webpage! I'm not sure why that happens, but I have a clue.
Is there an easier way to do what I want to do? I only want to show a few lines of text that will describe each image. Seems simple enough to me, but I'm just too new to make it work.
I am not very familiar with AJax, and for simplicity sake, I am trying a simple code. When I click the text box it should change the text and display "hello there", but it did not change. Is there something wrong with the code? I know this can be done with out using AJAX, but I want to test AJAX.page1.php
PHP Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
I am trying to learn SVG and I have alot of the basics including javascript manipulation. But I am really stuck on trying to manipulate the actual text itself.
I am trying to change the text "OMG" to say something else when you hover over it. For example: It says OMG, I want to hover over the text and have it change to WTF. Like you could do with innerHTML. anybody have any experience with SVG
The very simple code (below) works fine in Safari (and Chrome, Firefox etc.), but it doesn't work in Mobile Safari. Why?(You can find a working example at: http:[url]....)
Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head>[code]......
Is there code to just underline linked text to a certain color (red) but doesn't change the text color (it was white & when hovered over, it still stays white with a red underline)?
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