Jeg har søgt og ledt, men ingen steder kan jeg finde en forklaring som denne:
<img src="images/pimp-dog.jpeg" style="Filter:Alpha(Opacity=100, FinishOpacity=0, Style=1, StartX=0, StartY=0, FinishX=580, FinishY=0;"/>
omskrevet til at virke i firefox!!
Har forsøgt mig med diverse javascripts, men de virker HELLER ikke i firefox!
Har forsøgt med -moz-opacity, men det fungerer tilsyneladende heller ikke.
mit billede skal fade ud så kun venstre del af billedet vises.
Jeg skal gerne bruge en løsning for jeg har deadline d.9/12-2010.
Rigtig god weekend!!
Css3 faded image i firefox!
11 indlæg
• Side 1 af 1
Re: Css3 faded image i firefox!
af Kim Ludvigsen » tors nov 25, 2010 17:50
Tjek denne side:
http://clagnut.com/sandbox/imagefades/
Deres kode skulle virke i alle browsere, og det virker i hvert fald i min Firefox.
http://clagnut.com/sandbox/imagefades/
Deres kode skulle virke i alle browsere, og det virker i hvert fald i min Firefox.
Mvh.
Kim Ludvigsen
Kim Ludvigsen
- Kim Ludvigsen
- Site Admin
- Indlæg: 7192
- Tilmeldt: tors jun 08, 2006 0:49
Re: Css3 faded image i firefox!
af Alodia » tors nov 25, 2010 18:06
Tak Kim, Men jeg ser ikke det jeg gerne ville se....
Måske skal jeg løse det med PS, det er bare h....... til arbejde.
Måske skal jeg løse det med PS, det er bare h....... til arbejde.
- Alodia
- Indlæg: 6
- Tilmeldt: tors nov 25, 2010 17:18
Re: Css3 faded image i firefox!
af Alodia » tors nov 25, 2010 18:10
Måske jeg har spurgt forkert...
Mine billeder i div-tagget skifter for hver ny side. Hvert billede skal være "gennemsigtigt" i ca. 1/3-del (højre side) og det skal det være "stationært" ikke animeret.
Der er MANGE billeder, derfor søger jeg en kode der virker både på IE og firefox!
Tusind tak
Mine billeder i div-tagget skifter for hver ny side. Hvert billede skal være "gennemsigtigt" i ca. 1/3-del (højre side) og det skal det være "stationært" ikke animeret.
Der er MANGE billeder, derfor søger jeg en kode der virker både på IE og firefox!
Tusind tak
- Alodia
- Indlæg: 6
- Tilmeldt: tors nov 25, 2010 17:18
Re: Css3 faded image i firefox!
af Kim Ludvigsen » tors nov 25, 2010 19:11
Ok, jeg misforstod spørgsmålet. Prøv at kigge på denne side:
http://stackoverflow.com/questions/2630 ... t-an-image
Der er et eksempel på brug af svg - og en alternativ løsning, som burde virke i alle nyere browsere.
http://stackoverflow.com/questions/2630 ... t-an-image
Der er et eksempel på brug af svg - og en alternativ løsning, som burde virke i alle nyere browsere.
Mvh.
Kim Ludvigsen
Kim Ludvigsen
- Kim Ludvigsen
- Site Admin
- Indlæg: 7192
- Tilmeldt: tors jun 08, 2006 0:49
Re: Css3 faded image i firefox!
af Alodia » tors nov 25, 2010 20:30
hmmm.............der stod jeg lige af!!
Mine kodeegenskaber er vist blevet temmelig rustne!!
Kan du hjælpe mig med at sætte det rigtigt ind???
mit doc ser sådan ud:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<link rel="stylesheet" type="text/css" href="css1.css">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<body >
</div>
<img src="images/pimp-dog.jpeg" style="filter: Alpha(opacity=0, finishopacity=100, style=1, startx=80, starty=0, finishx=50, finishy=0);"/>
</body>
</html
Mine kodeegenskaber er vist blevet temmelig rustne!!
Kan du hjælpe mig med at sætte det rigtigt ind???
mit doc ser sådan ud:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<link rel="stylesheet" type="text/css" href="css1.css">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
</head>
<body >
</div>
<img src="images/pimp-dog.jpeg" style="filter: Alpha(opacity=0, finishopacity=100, style=1, startx=80, starty=0, finishx=50, finishy=0);"/>
</body>
</html
- Alodia
- Indlæg: 6
- Tilmeldt: tors nov 25, 2010 17:18
Re: Css3 faded image i firefox!
af Kim Ludvigsen » tors nov 25, 2010 20:53
Jeg forstår det desværre ikke - jeg håbede, du kunne forstå det.
Det nemmeste er nok at lave en div med linear gradient ved hjælp af css3, som de beskriver på siden, og så placere denne præcist ovenpå det billede, du vil have udtonet. Der står lidt mere om metoden med css3 her:
https://developer.mozilla.org/en/CSS/-m ... r-gradient
Der er et eksempel med gennemsigtighed nederst på siden.
Jeg kan desværre ikke hjælpe dig videre, da jeg intet kender til metoden udover det, som står på de tillinkede sider.
En anden løsning kunne måske være at lave billederne med udtoning i et grafikprogram - hvis der ikke er alt for mange billeder.
Ellers findes der måske et mere grafikorienteret forum et eller andet sted, der kan hjælpe.
Det nemmeste er nok at lave en div med linear gradient ved hjælp af css3, som de beskriver på siden, og så placere denne præcist ovenpå det billede, du vil have udtonet. Der står lidt mere om metoden med css3 her:
https://developer.mozilla.org/en/CSS/-m ... r-gradient
Der er et eksempel med gennemsigtighed nederst på siden.
Jeg kan desværre ikke hjælpe dig videre, da jeg intet kender til metoden udover det, som står på de tillinkede sider.
En anden løsning kunne måske være at lave billederne med udtoning i et grafikprogram - hvis der ikke er alt for mange billeder.
Ellers findes der måske et mere grafikorienteret forum et eller andet sted, der kan hjælpe.
Mvh.
Kim Ludvigsen
Kim Ludvigsen
- Kim Ludvigsen
- Site Admin
- Indlæg: 7192
- Tilmeldt: tors jun 08, 2006 0:49
Re: Css3 faded image i firefox!
af Alodia » fre nov 26, 2010 10:35
nåhhhh ja. Det kunne da være en mulighed! det vil jeg prøve! takker! Vender tilbage med feed-back hvis det virker!
- Alodia
- Indlæg: 6
- Tilmeldt: tors nov 25, 2010 17:18
Re: Css3 faded image i firefox!
af Alodia » fre nov 26, 2010 12:49
Så fandt jeg en løsning!
herunder viser jeg html hvor alpha channel er den der virker i IE
nedenunder har jeg lavet en maske sådan at jeg lægger to billeder oven i hinanden...det ene vha en div class i mit eksterne css og det andet er så en PNG der ligger ovenpå i mit div-tag.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<link rel="stylesheet" type="text/css" href="css1.css">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link rel="stylesheet" type="text/css" href="css1.css">
<head>
<body>
<div>
<img src="images/pimp-dog.jpeg"
style="filter: Alpha(opacity=0, finishopacity=100, style=1, startx=80, starty=0, finishx=50, finishy=0);"/>
</div>
<div class="bg-pic"><img src="images/maske.png" /></div>
</body>
</html>
css hertil:
@charset "utf-8";
/* CSS Document */
body {
background:#ffffff}
.bg-pic{
background-image:url(images/pimp-dog.jpeg);
background-repeat:no-repeat;
}
herunder viser jeg html hvor alpha channel er den der virker i IE
nedenunder har jeg lavet en maske sådan at jeg lægger to billeder oven i hinanden...det ene vha en div class i mit eksterne css og det andet er så en PNG der ligger ovenpå i mit div-tag.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<link rel="stylesheet" type="text/css" href="css1.css">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link rel="stylesheet" type="text/css" href="css1.css">
<head>
<body>
<div>
<img src="images/pimp-dog.jpeg"
style="filter: Alpha(opacity=0, finishopacity=100, style=1, startx=80, starty=0, finishx=50, finishy=0);"/>
</div>
<div class="bg-pic"><img src="images/maske.png" /></div>
</body>
</html>
css hertil:
@charset "utf-8";
/* CSS Document */
body {
background:#ffffff}
.bg-pic{
background-image:url(images/pimp-dog.jpeg);
background-repeat:no-repeat;
}
- Alodia
- Indlæg: 6
- Tilmeldt: tors nov 25, 2010 17:18
Re: Css3 faded image i firefox!
af Alodia » fre nov 26, 2010 12:51
Maske-metoden virker i både IE og FF.....
- Alodia
- Indlæg: 6
- Tilmeldt: tors nov 25, 2010 17:18
Re: Css3 faded image i firefox!
af Kim Ludvigsen » ons dec 07, 2011 17:34
Fint, og tak for tilbagemeldingen.
Jeg ved ikke, hvem din side skal henvende sig til, men du skal måske være opmærksom på, at det ikke vil virke i Internet Explorer 6, da den ikke forstår opacity på hverken den ene eller anden måde. Personligt tager jeg ikke længere hensyn til IE6-brugere, men hvis du henvender dig til brugere i virksomheder, der stadig bruger Windows 2000, kan det være et problem.
Jeg ved ikke, hvem din side skal henvende sig til, men du skal måske være opmærksom på, at det ikke vil virke i Internet Explorer 6, da den ikke forstår opacity på hverken den ene eller anden måde. Personligt tager jeg ikke længere hensyn til IE6-brugere, men hvis du henvender dig til brugere i virksomheder, der stadig bruger Windows 2000, kan det være et problem.
Senest placeret øverst af Anonymous ons dec 07, 2011 17:34.
Mvh.
Kim Ludvigsen
Kim Ludvigsen
- Kim Ludvigsen
- Site Admin
- Indlæg: 7192
- Tilmeldt: tors jun 08, 2006 0:49
11 indlæg
• Side 1 af 1
Tilbage til Tips & Tricks - bruger til bruger
Hvem er online
Brugere der læser dette forum: Ingen og 44 gæster