Notifikationer

Markér alle som læst Log ud

compilos Nybegynder

09. september 2004 - 23:11 Der er 13 kommentarer og
2 løsninger

Ændre filter:alpha(opacity=10)

Når jeg trykker på en tekst vil jeg godt ha´ at mit Layer ændre sig fra filter:alpha(opacity=90 til filter:alpha(opacity=10).

vh
Compilos

Synes godt om

skovenborg Nybegynder

09. september 2004 - 23:27 #1

hvis dit layer har fx id'en "layer" - så kan du ændre det på denne måde:
<span onclick="document.getElementById('layer').style.filter = 'progid:DXImageTransform.Microsoft.Alpha(Opacity=10)';">Tekst</span>

Synes godt om

skovenborg Nybegynder

09. september 2004 - 23:30 #2

og hvis du også vil have mozilla browserne med:
<span onclick="document.getElementById('layer').style.filter = 'progid:DXImageTransform.Microsoft.Alpha(Opacity=10)';document.getElementById('layer').style.MozOpacity='0.1'">Tekst</span>

her skal du dog tilføje lidt til din style på layeret:
style="filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=90);-moz-opacity:0.9

Synes godt om

compilos Nybegynder

09. september 2004 - 23:31 #3

Vil gerne bruge det i en function. Men kan ikke få det til at virke ? :-(

function LayerTry()
{
var x=document.getElementsByName("Layer1");
x.style.filter="'progid:DXImageTransform.Microsoft.Alpha(Opacity=10)'"
}

Synes godt om

compilos Nybegynder

09. september 2004 - 23:32 #4

Bare det virker i IE - så er det OK.

Synes godt om

skovenborg Nybegynder

10. september 2004 - 00:19 #5

Du har vist et par anførselstegn for meget:
x.style.filter="progid:DXImageTransform.Microsoft.Alpha(Opacity=10)"

Desuden er det vigtigt at du definerer filteret nede i style-attributten, som jeg gør det i min anden kommentar. Og til sidst virker filteret af uforklarelige grunde kun på absolut positionerede elementer (med position:absolute) med mindre det er billeder.

Synes godt om

olebole Juniormester

10. september 2004 - 02:33 #6

<ole>

Det er slet ikke så uforklarligt ... det står højt og tydeligt i referencen:
http://msdn.microsoft.com/library/default.asp?url=/workshop/author/dhtml/reference/dhtml_reference_entry.asp

... her kan du også se, at 'position:absolute' blot er én mulighed :)

Der er mange grunde til, at compilos' script ikke virker:
Kun ganske få HTML-elementer kan have et name. Det er (i)frames, forms, form-elementer, vinduer ... og så håber jeg ikke, jeg har glemt nogen. Et div kan ikke have et name - det skal have et id.
Derudover hedder det document.getElementByName()
Og så var der - som skovenborg anfører - et sæt gåseøjne for meget

For at få det til at virke i Mozilla, kan du skrive:

function LayerTry() {
var x = document.getElementById("Layer1");
if (document.all) x.style.filter = "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)";
else x.style.MozOpacity = 0.1;
}

... og så skal dit div altså have id="Layer1".

Så vidt jeg husker, understøtter den seneste Firefox og Safari CSS3 på dette punkt og tager altså property'en 'opacity' direkte på style-objektet. Så til dem skulle det altså også være muligt at få det kompatibelt.
Jeg har ingen af dem omkring mig, så jeg kan desværre ikke teste :)

/mvh
</bole>

Synes godt om

olebole Juniormester

10. september 2004 - 02:35 #7

PS: Selvom det ikke fremgår af min kommentar, så virker scriptet, jeg skrev i både IE og Moz ;o)

Synes godt om

compilos Nybegynder

10. september 2004 - 22:04 #8

I Min Body har jeg følgende:
<td><font face="Verdana, Arial, Helvetica, sans-serif" size="1" color="#FFFFFF"><a href="#" onMouseOver="LayerTry">Forside</a></font></td>

Jeg har så erklæret javascriptet som ser sådan ud:

<script type="text/javascript">
function LayerTry()
{
var x = document.getElementByName("Layer1");
if (document.all) x.style.filter = "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)";
else x.style.MozOpacity = 0.1;
}
</Script>

Mit Layer1 ser sådan her ud:
<div class="boks" id="Layer1" style="position:absolute; filter:Alpha(opacity=20) ;left:318px; top:395px; width:99px; height:76px; z-index:1;background-color: #660033; layer-background-color: #660033; visibility: visible; border: 1px none #000000">prøv</div>

Hvorfor viker det ik´ :-(

Hilsner Compilos

Synes godt om

olebole Juniormester

10. september 2004 - 22:35 #9

... onMouseOver="LayerTry()">

Synes godt om

compilos Nybegynder

10. september 2004 - 22:48 #10

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">

function LayerTry()
{
var x=document.getElementsByName("Layer1");
x.style.filter='progid:DXImageTransform.Microsoft.Alpha(Opacity=20)';
}

</Script>
</head>

<body bgcolor="#660000" text="#000000" onLoad="MM_callJS('LayerTry')">
<div class="boks" id="Layer1" style="position:absolute; filter:Alpha(opacity=90); left:318px; top:395px; width:99px; height:76px; z-index:1;background-color: #660033; layer-background-color: #660033; visibility: visible; border: 1px none #000000">prøv</div>

<font face="Verdana, Arial, Helvetica, sans-serif" size="1" color="#FFFFFF"><a href="#" onMouseOver="LayerTry">Forside</a></font>
</body>
</html>

hvis vi nu tar´ udgangspunkt i dette, hvad er der så galt. -> Har snart ikke mere hår på toppen :-)

Compilos

Synes godt om

olebole Juniormester

10. september 2004 - 22:54 #11

Du mangler et sæt paranteser i funktions-kaldet ... se mit seneste indlæg ;o)

Synes godt om

compilos Nybegynder

10. september 2004 - 23:03 #12

Hmm. Takker Olebole (og skovenborg). - Det ser ud til at virke nu.
Øhhh - tror et af problemerne var at jeg havde det der google værktøjs-bar slået til (det er vidst ikke så godt.)

By the way. Smid lige et svar så jeg kan gi´ jer nogle points.

Og endnu engang tak for hjælpen

Compilos

Synes godt om

olebole Juniormester

10. september 2004 - 23:29 #13

Selvtak :)

Synes godt om

skovenborg Nybegynder

11. september 2004 - 00:31 #14

det hedder da heller ikke getElementByName men getElementsByName som compilos i starten skrev. Ellers giver det jo heller ikke meget mening da flere elementer godt kan have det samme navn (desuden bruges id også normalt til den slags, bla., som ole siger, fordi kun få elementer kan indeholde name-attributten).

Og ole har også ret i at opacity er begyndt at blive understøttet (i hvert fald af mozilla). Denne havde før den lidt specielle -moz-opacity, men er nu gået over til den officielle (men ufærdige) css3-standard.

Og så skal jeg undskylde jeg ikke lige svarede tilbage før nu ;-S

Synes godt om

olebole Juniormester

11. september 2004 - 00:50 #15

Du har ret skovenborg ... jeg har faktisk aldrig brugt den metode og troede faktisk, den returnerede et enkelt element. Den returnerer naturligvis en collection.
Sorry, my bad ;o)

Synes godt om

Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Følg dette spørgsmål

Opret Preview

Webudvikling kurser

Vi tilbyder markedets bedste kurser inden for webudvikling

Se alle Webudvikling kurser

Flere spørgsmål fra HTML kategorien

Titel	Indlæg	Oprettet	Seneste aktivitet
Hjælp med HTML og CSS Af Nojsa i HTML	18	10/09/202515:07	17/09/202515:11
CSS 2 x firkanter + tekst på samme linje Af nemlig i HTML	3	19/03/202522:16	20/03/202513:04
Se og ændre html på en webside Af magger i HTML	4	11/03/202513:55	12/03/202506:56
Få input felt, der er med fed skrift og formatteres på linje Af KurtG i HTML	5	02/03/202520:05	04/03/202515:40
Variabler som ikke virker Af Frits Jensen i HTML	3	30/10/202409:37	01/01/202515:27

Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten

Seneste artiklerRSS