Opacity

S

salonowiec

Can you help me with following or show proper group; what's wrong with
"opacity" in this:

<img src="apa2.png"; style="height:480 width:640 opacity: 0.5" />

Opacity in my FFox 3.5 doesn't work.

Thank you...
 
J

Jukka K. Korpela

Ben said:
Try style="height:480px; width:640px; opacity: 0.5"

And omit the ";" after "apa2.png".
Gotta get the syntax right.

Gotta learn to use checkers like
http://validator.w3.org/
http://jigsaw.w3.org/css-validator/
(Somewhat difficult for novices, since the checkers speak rather technical
languages, but novices really don't get the syntax right without checkers,
and experts _know_ they don't get it right without checkers.)

ObHTML: the alt attribute is required in an <img> element, and most probably
essential for a content image that is larger than my typical browser window.
 
S

salonowiec

Uzytkownik "Jukka K. Korpela said:
And omit the ";" after "apa2.png".


Gotta learn to use checkers like
http://validator.w3.org/
http://jigsaw.w3.org/css-validator/
(Somewhat difficult for novices, since the checkers speak rather technical
languages, but novices really don't get the syntax right without checkers,
and experts _know_ they don't get it right without checkers.)

ObHTML: the alt attribute is required in an <img> element, and most
probably essential for a content image that is larger than my typical
browser window.



And this works:

<img src="xxxxx" width="640" height="480" alt="xxxxx"
style="opacity:0.1" />
The secret is in quotes, semicolons?...
 
J

Jonathan N. Little

salonowiec said:
<img src="xxxxx" width="640" height="480" alt="xxxxx"
style="opacity:0.1" />
The secret is in quotes, semicolons?...

Well, yes sort of, they all need to be in the correct places. But its
apple and oranges in your efforts. Style property rules need to be
separated by semicolons, but HTML attributes must not.

This XHTML example shows correct syntax for scaling an image by the
XHTML *attibutes* width and height:

<img src="xxxxx" width="640" height="480" alt="xxxxx" style="opacity:
0.1" />

And this using the style *properties* width and height:

<img src="xxxxx" alt="xxxxx" style="width: 640px; height: 480px;
opacity: 0.1" />

Yes you have use the correct syntax for it to work

PS: Neither of the above examples are going to work in IE<=8

PPS: w3schools.com has *no* affiliation with W3C, and some of the info
on the site is inaccurate and sometimes just plain wrong.
 
C

Captain Paralytic

PPS: w3schools.com has *no* affiliation with W3C, and some of the info
on the site is inaccurate and sometimes just plain wrong.
This implies that some of the inaccurate information is correct???
 
J

Jonathan N. Little

This implies that some of the inaccurate information is correct???

Just too abridged,

....some of the info on the site is inaccurate and sometimes it is just
plain wrong
 
C

Captain Paralytic

Just too abridged,

...some of the info on the site is inaccurate and sometimes it is just
plain wrong
Still implies the same thing. It suggests that some of the information
on the site is inaccurate, but may not be "plain wrong".
 
1

123Jim

Just too abridged,

...some of the info on the site is inaccurate and sometimes it is just
plain wrong
Still implies the same thing. It suggests that some of the information
on the site is inaccurate, but may not be "plain wrong".

Wish someone here would point out some examples from that site are wrong
...as I find it is concisely written. easy to search, a quick reference ..
where are the glaring errors?
 
J

Jukka K. Korpela

123Jim said:
Wish someone here would point out some examples from that site
[w3schools] are wrong ..as I find it is concisely written. easy to search,
a > quick reference .. where are the glaring errors?

The problem is the simple and searchable presentation that you describe,
combined with unreliability of content. Glaring errors are less harmful than
less obvious errors. Glaring errors make the novice go away.

The problems of w3schools content are discussed fairly often in relevant
Usenet groups. Stick around...

.... but as a simple example, about my pet peeve, the page
http://www.w3schools.com/tags/tag_IMG.asp
basically gets things right, _except_ for its example. And as you may know,
if you give an excellent theoretical and practical presentation accompanied
with a poor example, it is the example that people will understand and
remembed.

When would you say "Angry face" in conversation, or in writing? Wouldn't you
rather say "I'm angry"? Or, more naturally, "You goofed it up again!" or
"You bastards!".

Yet the page gives the example
<img src="angry.gif" alt="Angry face" />
(pointlessly using XHTML syntax, but that's much less serious). They simple
didn't give the issue of ALTernative text the slightest *thought*. They just
wrote a stupid (and, as it happens, a wrong) _description_ of an image.

And if you look at
http://www.w3schools.com/Css/css_image_transparency.asp
you'll see examples that contain _no_ alt attribute, even though another
pages of theirs (correctly) indicates it as required.

Examples are never "just examples". Examples are what people learn from.
Texts are just casual explanations and annotations, mostly ignored.
 
D

dorayme

"Jonathan N. Little said:
Just too abridged,

...some of the info on the site is inaccurate and sometimes it is just
plain wrong

You said it right in the first place, Jonathan. It was not too
abridged. The distinction between being partly wrong and totally
wrong is a perfectly useful and understandable notion.
 
J

Jonathan N. Little

dorayme said:
You said it right in the first place, Jonathan. It was not too
abridged. The distinction between being partly wrong and totally
wrong is a perfectly useful and understandable notion.

My proses may wax poetic?
 
1

123Jim

Jukka K. Korpela said:
123Jim said:
Wish someone here would point out some examples from that site
[w3schools] are wrong ..as I find it is concisely written. easy to
search, a > quick reference .. where are the glaring errors?

The problem is the simple and searchable presentation that you describe,
combined with unreliability of content. Glaring errors are less harmful
than less obvious errors. Glaring errors make the novice go away.

The problems of w3schools content are discussed fairly often in relevant
Usenet groups. Stick around...

... but as a simple example, about my pet peeve, the page
http://www.w3schools.com/tags/tag_IMG.asp
basically gets things right, _except_ for its example. And as you may
know, if you give an excellent theoretical and practical presentation
accompanied with a poor example, it is the example that people will
understand and remembed.

When would you say "Angry face" in conversation, or in writing? Wouldn't
you rather say "I'm angry"? Or, more naturally, "You goofed it up again!"
or "You bastards!".

Yet the page gives the example
<img src="angry.gif" alt="Angry face" />
(pointlessly using XHTML syntax, but that's much less serious). They
simple didn't give the issue of ALTernative text the slightest *thought*.
They just wrote a stupid (and, as it happens, a wrong) _description_ of an
image.

And if you look at
http://www.w3schools.com/Css/css_image_transparency.asp
you'll see examples that contain _no_ alt attribute, even though another
pages of theirs (correctly) indicates it as required.

Examples are never "just examples". Examples are what people learn from.
Texts are just casual explanations and annotations, mostly ignored.

Aha . I understand .. thanks .. I will look out for these errors in future
... Makes me wonder though why no-one gives them feedback on their errors
 
A

Andy

salonowiec said:
Can you help me with following or show proper group; what's wrong with
"opacity" in this:

<img src="apa2.png"; style="height:480 width:640 opacity: 0.5" />

Opacity in my FFox 3.5 doesn't work.

Thank you...

Hi,

This is what I use on my site...

Full visibility...

<img src="pic.gif" style="filter:alpha(opacity=100); -moz-opacity:1.0;
opacity:1.0; -khtml-opacity:1.0;">

Half faded...

<img src="pic.gif" style="filter:alpha(opacity=50); -moz-opacity:0.5;
opacity:0.5; -khtml-opacity:0.5;">

Vanished...

<img src="pic.gif" style="filter:alpha(opacity=0); -moz-opacity:0.0;
opacity:0.0; -khtml-opacity:0.0;">


Hope this helps

Andy
 
S

salonowiec

U¿ytkownik "Andy said:
Hi,

This is what I use on my site...

Full visibility...

<img src="pic.gif" style="filter:alpha(opacity=100); -moz-opacity:1.0;
opacity:1.0; -khtml-opacity:1.0;">

Half faded...

<img src="pic.gif" style="filter:alpha(opacity=50); -moz-opacity:0.5;
opacity:0.5; -khtml-opacity:0.5;">

Vanished...

<img src="pic.gif" style="filter:alpha(opacity=0); -moz-opacity:0.0;
opacity:0.0; -khtml-opacity:0.0;">


Hope this helps

Andy

Thank you, Andy, I hope I'm O.K. with "opacity" now. There is one more
problem: opacity in FF has one parameter which is transparency (0 to 1). The
IE is:
filter: Alpha(Opacity=100, Style=3) so there is Style parameter which makes
really nice effects. Have you any idea how it might be realized in IE?

Thanks...
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Threads
473,744
Messages
2,569,482
Members
44,900
Latest member
Nell636132

Latest Threads

Top