Notifikationer

Markér alle som læst Log ud

passiflora Juniormester

04. maj 2007 - 10:17 Der er 8 kommentarer og
1 løsning

Placering af billed

Hejsa.

Jeg ville gerne kunne placerer et billede på en bestemt placering på skærmen, uanset hvorlangt nede jeg er på den pågældende side.

Jeg forestiller mig at jeg har en række links på en side, mere en et skærmbillede, og ville gerne have at når man trykkede på link'et, blev f.eks. et billede vist umiddelbart ved siden af.

Ville gerne kunne løse vha. css / aps ... kan man det? og hvor'n skær man den kage ...

Søren

Synes godt om

roenving Novice

05. maj 2007 - 05:10 #1

Brug f.eks. overLib: http://www.bosrup.com/web/overlib/ !-)

Synes godt om

passiflora Juniormester

05. maj 2007 - 10:26 #2

Men det jo ikke css eller asp ... så der findes nok ikke en sådan løsning øv ... slipper nok ikke udenom at lære noget java

Men nu tænker jeg lige lidt højt ...

Mine links kommer fra en database, og jeg refresher siden for vise det pågældende billede. Så må jeg jo kunne regne ud hvormange linier jeg skal ned for at finde den aktuelle post, og når jeg så kender liniehøjden, må jeg kunne placerer billedet udfor linien ...

Så skal jeg bare have fundet ud af om jeg kan scrolle ned på en side, så billedet kommer til at stå midt på siden ...

... må nok helre lave det i jave ...

Synes godt om

roenving Novice

05. maj 2007 - 15:05 #3

-- i Java kan du heller ikke lave det, men det går udmærket i javascript, som også Erik Bosrups script viser !-)

-- og Java og javascript har ca. 4 ting, som er ens: j - a - v - a !o]

Synes godt om

mclemens Nybegynder

05. maj 2007 - 15:22 #4

Hvis du kun skulle understøtte IE7+
samt andre browsere kunne du bruge:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html><head><meta http-equiv="content-type" content="text/html; charset=iso-8859-1"><title>Ingen titel</title>

<style type="text/css">
.tl img {display:none;}
.tl:active img {display:block;}
.tl:active > img {position:fixed;top:50%;left:50%;}
.tl > #eksperten {margin:-55px 0 0 -49px;}
.tl > #eksflag {margin:-5px 0 0 -5px;}
</style>

</head><body>
<div style="height:1000px;background:#f00;">Scroll ned</div>

<a class="tl" href="java script:void(0);">Vis<img src="http://www.eksperten.dk/img/elogo.png" id="eksperten"></a> - <a href="java script:void(0);">Skjul</a>

<div style="height:1000px;background:#ff0;">Scroll ned</div>

<a class="tl" href="java script:void(0);">Vis<img src="http://www.eksperten.dk/img/flag_green.gif" id="eksflag"></a> - <a href="java script:void(0);">Skjul</a

</body></html>

...

Men, der er nok 1 år eller mere til man kan ignorere IE6,
så løsningen må nok være at lege med js indtil videre.

Synes godt om

mclemens Nybegynder

05. maj 2007 - 15:23 #5

Med js mener jeg javascript :o)

Synes godt om

mclemens Nybegynder

05. maj 2007 - 15:34 #6

Hmm, 05/05-2007 15:22:36 ser nok
bedre ud i IE6 Hvis man ændrer:

.tl:active img {display:block;}

til:

.tl:active img {display:block;margin:0 auto;}

- Og så bytter rundt på Vis og skjul href's.

Synes godt om

mclemens Nybegynder

05. maj 2007 - 15:58 #7

"blev f.eks. et billede vist umiddelbart ved siden af."
Hmm, jeg læser vist ikke helt ordentligt igennem ...
- Hvis det bare er placering lige ved siden af burde
denne kunne gøre det (så er der heller ikke det med halv
bredde og halv højde i negativ margin for hvert billede)

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html><head><meta http-equiv="content-type" content="text/html; charset=iso-8859-1"><title>Ingen titel</title>

<style type="text/css">
.tl img {display:none;}
.tl:active img {display:inline;margin:0 5px;}
</style>

</head><body>
<div style="height:1000px;background:#f00;">Scroll ned</div>

<a href="java script:void(0);">Skjul</a> / <a class="tl" href="java script:void(0);">Vis<img src="http://www.eksperten.dk/img/elogo.png"></a>

<div style="height:1000px;background:#ff0;">Scroll ned</div>

<a href="java script:void(0);">Skjul</a> / <a class="tl" href="java script:void(0);">Vis<img src="http://www.eksperten.dk/img/flag_green.gif"></a>

</body></html>

.tl:active img {display:inline;margin:0 5px;}
kan også skrives som
.tl:active img {display:block;margin:0 auto;}
- Hvis det skal være centreret under der hvor man klikker.

Synes godt om

passiflora Juniormester

14. maj 2007 - 08:20 #8

Takker for svarene.

Synes at mclemens' ser enkel og tilgængelig ud ... så'e ... et svar vil i mødekommes med tak

Synes godt om

mclemens Nybegynder

14. maj 2007 - 08:39 #9

Velbekom, her er et svar :o)
Og tak for point :)

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