/ Forside / Teknologi / Udvikling / HTML / Nyhedsindlæg
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
HTML
#NavnPoint
molokyle 11184
Klaudi 5506
bentjuul 3377
severino 2040
smorch 1950
strarup 1525
natmaden 1396
scootergr.. 1320
e.c 1150
10  miritdk 1110
Fade kanten på et billed evt. rund
Fra : Jakob Espesen


Dato : 20-06-06 16:00

Jeg laver billeder af personer som jeg gerne vil have til at fade
i kanterne. Indtil videre er jeg kommet til:

<img src="/images/x.jpg" width="150" height="150"
style="filter:alpha(Opacity=100, FinishOpacity=0, Style=2)>

Men så fader den helt ind til midten!

Jeg vil gerne have det så der fades fra 100 til 0 på de første 10
til 20 pixel, så midten bliver helt uigennemsigtig!

Nogen der har nogle forslag?

site: www.espesen.dk/sites/personale.asp

--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

 
 
jopa (20-06-2006)
Kommentar
Fra : jopa


Dato : 20-06-06 16:55

Jakob Espesen skriblede bla:
>
> Nogen der har nogle forslag?
>
> site: www.espesen.dk/sites/personale.asp

Jeg ville bruge mit grafik program til det

--
Mvh.John
www.jp-web.dk
www.john.jp-web.dk




Jakob Espesen (20-06-2006)
Kommentar
Fra : Jakob Espesen


Dato : 20-06-06 17:25



>jopa wrote in dk.edb.internet.webdesign.html:
>
> Jeg ville bruge mit grafik program til det
>
Tak for svaret!

Det har jeg prøvet, men kan ikke få det der fades til at blive
gennemsigtigt! Ville desuden gerne kunne gøre det på koder så det
bliver gjort når jeg skifter billederne ud!

Jakob

--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

jopa (20-06-2006)
Kommentar
Fra : jopa


Dato : 20-06-06 17:42

Jakob Espesen skriblede bla:
>
> Det har jeg prøvet, men kan ikke få det der fades til at blive
> gennemsigtigt! Ville desuden gerne kunne gøre det på koder så det
> bliver gjort når jeg skifter billederne ud!
>
Ok men filter:alpha mener jeg kun virker med IE.
Sådan ser det ud i min Firefox: http://zora.dk/fade.jpg

--
Mvh.John
www.jp-web.dk
www.john.jp-web.dk




Jørgen Farum Jensen (20-06-2006)
Kommentar
Fra : Jørgen Farum Jensen


Dato : 20-06-06 19:28

jopa wrote:
> Jakob Espesen skriblede bla:
>
>>Det har jeg prøvet, men kan ikke få det der fades til at blive
>>gennemsigtigt! Ville desuden gerne kunne gøre det på koder så det
>>bliver gjort når jeg skifter billederne ud!
>>
>
> Ok men filter:alpha mener jeg kun virker med IE.
> Sådan ser det ud i min Firefox: http://zora.dk/fade.jpg
>

Det gør det også (kun). Der er mig bekendt ikke nogen måde
hvorpå man kan lave variabel opacitet i Gecko
browsere.

Men hvis man alligevel vil lave til IE Only, er
der en slags opskrift her:

http://www.webdesign101.dk/web102/dhtml/transitions/statiske_filtre/alpha_filter.html

--

Med venlig hilsen

Jørgen Farum Jensen
http://www.webdesign101.dk
..

Benny Nissen (20-06-2006)
Kommentar
Fra : Benny Nissen


Dato : 20-06-06 19:32

Jørgen Farum Jensen ramte sit keyboard den 20-06-2006 20:27 og fik dette
ud af det:

> Men hvis man alligevel vil lave til IE Only

Men *det* vil man forhåbentlig ikke

--
Benny Nissen
www.bennynissen.dk

jopa (20-06-2006)
Kommentar
Fra : jopa


Dato : 20-06-06 19:43

Jørgen Farum Jensen skriblede bla:
> Det gør det også (kun). Der er mig bekendt ikke nogen måde
> hvorpå man kan lave variabel opacitet i Gecko
> browsere.
>
> Men hvis man alligevel vil lave til IE Only, er
> der en slags opskrift her:
>
> http://www.webdesign101.dk/web102/dhtml/transitions/statiske_filtre/alpha_filter.html

Altså er vi tilbage til svaret med at lave det i et grafikprog, hvilket også
er det ultimative


--
Mvh.John
www.jp-web.dk
www.john.jp-web.dk




Jakob Espesen (21-06-2006)
Kommentar
Fra : Jakob Espesen


Dato : 21-06-06 15:41

Tak for de mange forslag, desværre løser det bare ikke mit problem!

Jeg kan se at der er begrænsninger i at bruge alpha filter som så vidt jeg kan se ikke kan
løse mit problem, hvor jeg kun ønsker at fade kanterne og ikke helt ind til midten!

Jeg har prøvet med flere grafik programmer, og kan få dem til at fade ud i kanterne, men
det ender altid med at det fader ud i hvid også står der på hjemmesiden en hvid kasse med
indhold. Her kan jeg så fjerne den hvide farve ved hjælp af
ALLOWTRANSPARENCY=TRUE style="filter:chroma(color=#ffffff);"

Men så bliver overgangen med de forskellige lyse nyancer at se og ikke gennemsigtig!!!

Jeg har både Micrografx picture publisher, Arcsoft photostudio 5.5 og macromedia fireworks
8 men kan ikke få det til at virke. Er der nogen der har forslag til hvilket program der
kan gøre det og måske et link til en gennemgang af processen??

Sidste spørgsmål: Er det rigtigt som jeg har forstået at jpg filer ikke kan bruges (ikke
understøtter transparent)? og skal jeg så bruge Gif filer som er meget større?

På forhånd tak!

> http://www.webdesign101.dk/web102/dhtml/transitions/statiske_filtre/alpha_filter.html
>
> Altså er vi tilbage til svaret med at lave det i et grafikprog, hvilket også
> er det ultimative
>
>
> --
> Mvh.John
> www.jp-web.dk
> www.john.jp-web.dk
>
>
>


--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Erik Ginnerskov (21-06-2006)
Kommentar
Fra : Erik Ginnerskov


Dato : 21-06-06 16:45

Jakob Espesen wrote:

> Jeg kan se at der er begrænsninger i at bruge alpha filter som så
> vidt jeg kan se ikke kan løse mit problem,

Egenskaben "alpha filter" er noget IE-noget, som ingen andre browsere
forstår.

> Jeg har prøvet med flere grafik programmer, og kan få dem til at fade
> ud i kanterne, men det ender altid med at det fader ud i hvid

Grafikprogrammerne fader ud til den baggrundsfarve, du aktuelt har sat i
programmet. Har du f.eks. valgt rød baggrund, fades ud til rød.


> Men så bliver overgangen med de forskellige lyse nyancer at se og
> ikke gennemsigtig!!!

Ja, fade til baggrundsfarve og gradvis transparens er to forskellige ting.

> Jeg har både Micrografx picture publisher, Arcsoft photostudio 5.5 og
> macromedia fireworks 8 men kan ikke få det til at virke. Er der nogen
> der har forslag til hvilket program der kan gøre det og måske et link
> til en gennemgang af processen??

Vælger du grafikformatet png, kan du teoretisk lave den gradvise
transparens - det er bare noget, IE ikke forstår, så det vil ikke virke i
den browser. Men hvordan det laves, kan jeg desværre ikke fortælle dig -
bl.a. fordi jeg ikke benytter nogen af de grafikprogrammer du har.

> Sidste spørgsmål: Er det rigtigt som jeg har forstået at jpg filer
> ikke kan bruges (ikke understøtter transparent)? og skal jeg så bruge
> Gif filer som er meget større?

Ja, formatet jpg giver ikke mulighed for transparens. Men det gør gif og
png - sidstnævnte endda gradvis.

--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk/ - http://ginnerskov.dk/
http://html-faq.dk/



jopa (21-06-2006)
Kommentar
Fra : jopa


Dato : 21-06-06 17:29

Erik Ginnerskov skriblede bla:
> Vælger du grafikformatet png, kan du teoretisk lave den gradvise
> transparens - det er bare noget, IE ikke forstår, så det vil ikke
> virke i den browser.

Virker da fint i IE
http://zora.dk/hund.png

Hvis ikke der er noget jeg har misforstået


--
Mvh.John
www.jp-web.dk
www.john.jp-web.dk




jopa (21-06-2006)
Kommentar
Fra : jopa


Dato : 21-06-06 17:34

jopa skriblede bla:
>
> Virker da fint i IE
> http://zora.dk/hund.png
>
> Hvis ikke der er noget jeg har misforstået

og det havde jeg sorry
--
Mvh.John
www.jp-web.dk
www.john.jp-web.dk




Kim Malchau (21-06-2006)
Kommentar
Fra : Kim Malchau


Dato : 21-06-06 19:34

On Wed, 21 Jun 2006 17:45:12 +0200, Erik Ginnerskov wrote:

>
> Vælger du grafikformatet png, kan du teoretisk lave den gradvise
> transparens - det er bare noget, IE ikke forstår, så det vil ikke virke i
> den browser.

IE kan bringes til at vise transparens korrekt for 24-bit png-filer.

Se fx her: http://koivi.com/ie-png-transparency/

Venlig hilsen
Kim Malchau

--
Videndeling - http://vibration.dk

jopa (21-06-2006)
Kommentar
Fra : jopa


Dato : 21-06-06 20:04

Kim Malchau skriblede bla:
>
> Se fx her: http://koivi.com/ie-png-transparency/
>

a ka it se noet

--
Mvh.John
www.jp-web.dk
www.john.jp-web.dk




René Lønstrup (21-06-2006)
Kommentar
Fra : René Lønstrup


Dato : 21-06-06 21:14

jopa wrote:
>> Se fx her: http://koivi.com/ie-png-transparency/
>
> a ka it se noet

Prøv: http://webfx.eae.net/dhtml/pngbehavior/pngbehavior.html (ved ikke om
det er samme metode Kim henviser til, men dette er den jeg typisk benytter)


--
Mvh René Lønstrup
web: http://rene.loenstrup.net?r=usenet
email: se om du kan regne den ud..



jopa (21-06-2006)
Kommentar
Fra : jopa


Dato : 21-06-06 21:21

René Lønstrup skriblede bla:
>
> Prøv: http://webfx.eae.net/dhtml/pngbehavior/pngbehavior.html (ved
> ikke om det er samme metode Kim henviser til, men dette er den jeg
> typisk benytter)

Jo men jeg kan også lave et png med transperent bg.
Kniber mere når man skal fade kanten, men ok det skal da ses på


--
Mvh.John
www.jp-web.dk
www.john.jp-web.dk




Erik Ginnerskov (21-06-2006)
Kommentar
Fra : Erik Ginnerskov


Dato : 21-06-06 21:46

René Lønstrup wrote:

> Prøv: http://webfx.eae.net/dhtml/pngbehavior/pngbehavior.html (ved
> ikke om det er samme metode Kim henviser til, men dette er den jeg
> typisk benytter)

Aha. Med lidt javascript kan man altså få IE til at opføre sig nogenlunde
korrekt i forhold til png med delvis transparens.

Havde de tilføjet den obligatoriske alt="foo" til billedet, havde demosiden
tilmed været valid.

--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk/ - http://ginnerskov.dk/
http://html-faq.dk/



jopa (21-06-2006)
Kommentar
Fra : jopa


Dato : 21-06-06 17:15

Jakob Espesen skriblede bla:
> Sidste spørgsmål: Er det rigtigt som jeg har forstået at jpg filer
> ikke kan bruges (ikke understøtter transparent)? og skal jeg så bruge
> Gif filer som er meget større?
>
Gif eller png
--
Mvh.John
www.jp-web.dk
www.john.jp-web.dk




Jørgen Farum Jensen (21-06-2006)
Kommentar
Fra : Jørgen Farum Jensen


Dato : 21-06-06 22:35

Jakob Espesen wrote:

> Jeg har både Micrografx picture publisher, Arcsoft photostudio 5.5 og macromedia fireworks
> 8 men kan ikke få det til at virke. Er der nogen der har forslag til hvilket program der
> kan gøre det og måske et link til en gennemgang af processen??

Micrografx har en del makroer, der laver
forskellige kanteffekter, blandt andet den
du efterlyser.

Image/Wizards/Edge Effects/Crystal

Den toner kanten ud i baggrundsfarven, som du selv
kan vælge.


--

Med venlig hilsen

Jørgen Farum Jensen
http://www.webdesign101.dk
..

Daniel Witvliet (20-06-2006)
Kommentar
Fra : Daniel Witvliet


Dato : 20-06-06 19:04

I Firefox kan du fade ved at bruge:

style="opacity: 0.85; -moz-opacity: 0.85;"


Det fader dog det hele, men jeg håber det kan hjælpe xD

--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

gitte (22-06-2006)
Kommentar
Fra : gitte


Dato : 22-06-06 04:58


"Jakob Espesen" <jakob@espesen.dk> wrote in message
news:44980d86$0$15794$14726298@news.sunsite.dk...
> Jeg laver billeder af personer som jeg gerne vil have til at fade
> i kanterne. Indtil videre er jeg kommet til:
>
> <img src="/images/x.jpg" width="150" height="150"
> style="filter:alpha(Opacity=100, FinishOpacity=0, Style=2)>
>
> Men så fader den helt ind til midten!

<img src="images/sunface.gif" style="Filter: Alpha(Opacity=100,
FinishOpacity=0, Style=2, StartX=20, StartY=40, FinishX=0, FinishY=0)">

prøv dette.

gitte



Frank Olieu (22-06-2006)
Kommentar
Fra : Frank Olieu


Dato : 22-06-06 12:33

"gitte" <gitte@gotoheaven.dk> wrote in news:GaydnZ9s2-
SjiAfZnZ2dnUVZ8qudnZ2d@giganews.com:

> <img src="images/sunface.gif" style="Filter: Alpha(Opacity=100,
> FinishOpacity=0, Style=2, StartX=20, StartY=40, FinishX=0, FinishY=0)">
>
> prøv dette.

Virker dette kun i IE7, eller er det bare mig?

--
Venlig hilsen | Kind regards | Cordialement
Frank

Jakob Espesen (22-06-2006)
Kommentar
Fra : Jakob Espesen


Dato : 22-06-06 14:52

Frank Olieu wrote in dk.edb.internet.webdesign.html:
>
> Virker dette kun i IE7, eller er det bare mig?
>
Jeg kan heller ikke rigtig få det til at give nogen forskel. Kun hvis man
bruger style=1.

Mig generelle problem er desuden at jeg ikke bare kan fade ud i en farve som
svarer til baggrundsfarven, da denne også er en gradient mellem to farver
(en grøn og en grå)

Men mange tak for de mange gode forslag indtil nu!

--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

gitte (22-06-2006)
Kommentar
Fra : gitte


Dato : 22-06-06 15:15


"Jakob Espesen" <jakob@espesen.dk> wrote in message
news:449aa077$0$15784$14726298@news.sunsite.dk...
> Frank Olieu wrote in dk.edb.internet.webdesign.html:
>>
>> Virker dette kun i IE7, eller er det bare mig?
>>
> Jeg kan heller ikke rigtig få det til at give nogen forskel. Kun hvis man
> bruger style=1.
>
> Mig generelle problem er desuden at jeg ikke bare kan fade ud i en farve
> som
> svarer til baggrundsfarven, da denne også er en gradient mellem to farver
> (en grøn og en grå)
>
> Men mange tak for de mange gode forslag indtil nu!

Du kunne bruge vml -lægge billedet ind der og bruge et filter, hvis det
andet ikke virker.

http://msdn.microsoft.com/library/default.asp?url=/workshop/author/VML/ref/adv3.asp

gitte



Jakob Espesen (23-06-2006)
Kommentar
Fra : Jakob Espesen


Dato : 23-06-06 22:05

gitte wrote in dk.edb.internet.webdesign.html:
> Du kunne bruge vml -lægge billedet ind der og bruge et filter, hvis det
> andet ikke virker.
>
> http://msdn.microsoft.com/library/default.asp?url=/workshop/author/VML/ref/adv3.asp
>
> gitte
>
Tak for svaret!

Jeg kunne ikke rigtig få det andet til at virke så jeg valgte din måde med en oval
kant om billedet!

Men hvordan se det ud i andre browsere end IE?

Kan billederne overhoved ses?


--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Jakob Espesen (24-06-2006)
Kommentar
Fra : Jakob Espesen


Dato : 24-06-06 07:43

gitte wrote in dk.edb.internet.webdesign.html:

> Du kunne bruge vml -lægge billedet ind der og bruge et filter, hvis det
> andet ikke virker.
>
> http://msdn.microsoft.com/library/default.asp?url=/workshop/author/VML/ref/adv3.asp
>
> gitte
>
Som sagt har jeg fået det til at virke, men nu vil jeg gerne flytte koderne over i
CCS.
Er kommet til:
#personalebilled {
width:150;
height:150;
stroke-color:#999966;
stroke-weight:3px;
}
Det virker hvad angår width og height som jeg kan ændre, men farven bliver sort og
stregen tynd (altså null værdien).

Hvordan skal det skrives?

På forhånd tak!


--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

gitte (22-06-2006)
Kommentar
Fra : gitte


Dato : 22-06-06 15:05


"Frank Olieu" <fr@nk.invalid> wrote in message
news:Xns97EA89E9B63F3frankol@130.225.247.90...
> "gitte" <gitte@gotoheaven.dk> wrote in news:GaydnZ9s2-
> SjiAfZnZ2dnUVZ8qudnZ2d@giganews.com:
>
>> <img src="images/sunface.gif" style="Filter: Alpha(Opacity=100,
>> FinishOpacity=0, Style=2, StartX=20, StartY=40, FinishX=0, FinishY=0)">
>>
>> prøv dette.
>
> Virker dette kun i IE7, eller er det bare mig?
>

ja det virker kun i IE .. også 6'eren.

gitte



> --
> Venlig hilsen | Kind regards | Cordialement
> Frank



Frank Olieu (22-06-2006)
Kommentar
Fra : Frank Olieu


Dato : 22-06-06 15:23

"gitte" <gitte@gotoheaven.dk> wrote in
news:oumdnc5nuMSXOwfZRVny2w@giganews.com:

> ja det virker kun i IE .. også 6'eren.

Ikke her... (virker kun i 7'eren).
Underligt. Skyldes måske at jeg bruger en standalone IE6?

--
Venlig hilsen | Kind regards | Cordialement
Frank

gitte (22-06-2006)
Kommentar
Fra : gitte


Dato : 22-06-06 15:30


"Frank Olieu" <fr@nk.invalid> wrote in message
news:Xns97EAA6AAF13C7frankol@130.225.247.90...
> "gitte" <gitte@gotoheaven.dk> wrote in
> news:oumdnc5nuMSXOwfZRVny2w@giganews.com:
>
>> ja det virker kun i IE .. også 6'eren.
>
> Ikke her... (virker kun i 7'eren).
> Underligt. Skyldes måske at jeg bruger en standalone IE6?
jeg bliver dig svar skyldig, har altid kun haft browseren sammen med
windows.
gitte



Jens Gyldenkærne Cla~ (24-06-2006)
Kommentar
Fra : Jens Gyldenkærne Cla~


Dato : 24-06-06 10:02

Jakob Espesen skrev:

> flytte koderne over i CCS.
> Er kommet til:
> #personalebilled {
> width:150;
> height:150;

Der mangler enhedsangivelse på width/height (formentlig mener du
150px).


> stroke-color:#999966;
> stroke-weight:3px;

De to egenskaber findes ikke i css. Mener du border? (border: 3px
solid #996;)
--
Jens Gyldenkærne Clausen
Svar venligst under det du citerer, og citer kun det der er
nødvendigt for at forstå dit svar i sammenhængen. Se hvorfor og
hvordan på http://usenet.dk/netikette/citatteknik.html

Lasse Reichstein Nie~ (24-06-2006)
Kommentar
Fra : Lasse Reichstein Nie~


Dato : 24-06-06 10:40

Jakob Espesen <jakob@espesen.dk> writes:

> Men hvordan se det ud i andre browsere end IE?

Det er ganske nemt at tjekke: Du downloader bare nogle andre browsere
og kigger. Det er generelt en god idé at have dem tilgængeligt mens du
udvikler din side alligevel, da IE's fejlbeskedder kan være noget ...
mangelfulde.

<URL:http://www.mozilla.com/firefox/>
<URL:http://www.opera.com/>

Man kan sagtens have flere browsere installeret på samme tidspunkt.

(For de avancerede kan man endda have flere IE-versioner på samme tid :)
/L
--
Lasse Reichstein Nielsen - lrn@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'

Frank Olieu (24-06-2006)
Kommentar
Fra : Frank Olieu


Dato : 24-06-06 14:14

Lasse Reichstein Nielsen <lrn@hotpop.com> wrote in
news:lkrmvqn0.fsf@hotpop.com:

> For de avancerede kan man endda have flere IE-versioner på samme tid :)

Ja, men der kan vist nok være små problemer med dem...
Se mine indlæg andetsteds i emnet, samt
news:Xns97EAB748FC5DEfrankol@130.225.247.90 i d.e.i.s.browser

--
Venlig hilsen | Kind regards | Cordialement
Frank

Søg
Reklame
Statistik
Spørgsmål : 177558
Tips : 31968
Nyheder : 719565
Indlæg : 6408928
Brugere : 218888

Månedens bedste
Årets bedste
Sidste års bedste