homepage Welcome to WebmasterWorld Guest from 23.22.173.58
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
Forum Library, Charter, Moderator: open

JavaScript and AJAX Forum

    
Check if an opacity value is set?
Br3nn4n

5+ Year Member



 
Msg#: 3973268 posted 8:36 am on Aug 17, 2009 (gmt 0)

I'm working with a fade script I built, that fades elements onclick via their id.

I want to know how I can check if an element has an opacity value (preferably, with cross browser support but maybe I can figure that out..) and if it doesn't assign it 100% (or 1...depending on the browser of course).

Is this possible? Otherwise, I have to manually assign 4 opacity values (for cross-browser crap) to every element I want to fade instead of just being able to call it on the fly.

Thanks in advance!

 

Arno_Adams

5+ Year Member



 
Msg#: 3973268 posted 1:14 pm on Aug 17, 2009 (gmt 0)

Make sure it has its opacity set.
Attach a class to the elements.

rocknbil

WebmasterWorld Senior Member rocknbil us a WebmasterWorld Top Contributor of All Time 5+ Year Member



 
Msg#: 3973268 posted 3:56 pm on Aug 17, 2009 (gmt 0)

First, review this [webmasterworld.com] and this [webmasterworld.com] thread.

Although the attribute is different (hidden/block), note that at page load, Javascript is "unaware" of an element's attributes unless this attribute is applied inline.

So you have to be mindful of this; you need to set the opacity with JS at onload, or set it inline. You can then "monitor" current opacity of an element using a timer or within your fade-in/out functions.

Br3nn4n

5+ Year Member



 
Msg#: 3973268 posted 11:53 am on Aug 18, 2009 (gmt 0)

Thanks guys. My only concern with using any inline styling is that it slows down page load times (actually, showing of the final page times..) if I remember correctly. From what I've heard the browser first reads any external styles and then applies any inline ones correct?

In my code, I have a small variable that simply sets (whatever element I'm fading's) opacity. That should work all the time right?

I can post code if you need, although it just randomly started working today >.<

whoisgregg

WebmasterWorld Senior Member whoisgregg us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 3973268 posted 1:39 pm on Aug 18, 2009 (gmt 0)

using any inline styling is that it slows down page load times

This may be the case if you use inline styling only, as all that extra code will make the page larger. (So on a slow connection the page would take longer to download.)

But AFAIK there's no inline styling penalty for browser rendering. CSS styles do cascade, but the styling of a particular element typically is the result of dozens of cascades anyway, adding one more inline is not a big deal.

rocknbil

WebmasterWorld Senior Member rocknbil us a WebmasterWorld Top Contributor of All Time 5+ Year Member



 
Msg#: 3973268 posted 5:27 pm on Aug 18, 2009 (gmt 0)

My only concern with using any inline styling is that it slows down page load times

If this is your concern, a solution from those links is to use the window.onload event to set attributes:

window.onload=function() { setStyles(); }

function setStyles() {
if document.getElementById('example_div')) {
document.getElementById('example_div').style.display='block';
}
}

Except you'd set initial opacity. In either case - inline or set at onload - JS will now be "aware" of the element's style.

This is better anyway, allows you to put it in an external file and cleans up inline markup.

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved