/ 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
Vedr. visning af billede
Fra : JH


Dato : 31-01-06 10:30

Hej NG

Jeg søger en kode som kan gøre følgende:

når man klikker på et tekstlink skal der komme et billede frem ikke i et nyt
vindue men bare på den side man er på....
Ligesom det her:
http://www.vvsweb.dk/productdetails.aspx?productid=108792&category=31_9

når man klikker på *produktvarianter*

Kan det laves i alm. html/java?

Mvh

June



 
 
Tidemann (31-01-2006)
Kommentar
Fra : Tidemann


Dato : 31-01-06 11:17

"JH" skrev
> Hej NG
>
> Jeg søger en kode som kan gøre følgende:
>
> når man klikker på et tekstlink skal der komme et billede frem ikke i et nyt
> vindue men bare på den side man er på....
> Ligesom det her:
> http://www.vvsweb.dk/productdetails.aspx?productid=108792&category=31_9
>
> når man klikker på *produktvarianter*
>

Ja, du kan lave det med en popup side, ved tryk på tekst eller billede. Tryk
på et af de små billeder og se:
http://www.ragdollys-cat-link.dk/fotoalbum-zamir.shtml
der skal alle popup gemmes som en ekstra html side!

Du kan også lave det som en popup ved mouseover, der kommer billedet frem når
du peger.
Se her: http://www.dhejne.dk/winnie.shtml der gemmer du bare et billede!


--
Venlig hilsen
Marianne
design af: - www.ragdollys-cat-link.dk - www.dhejne.dk
www.formdinfremtid.dk - www.royalmontana.dk


JH (31-01-2006)
Kommentar
Fra : JH


Dato : 31-01-06 11:29


> Du kan også lave det som en popup ved mouseover, der kommer billedet frem
> når
> du peger.
> Se her: http://www.dhejne.dk/winnie.shtml der gemmer du bare et billede!
>

Det er lige præcis det jeg er ude efter! Men hvad er
fremgangsmåden/html-koden?

/June



Tidemann (31-01-2006)
Kommentar
Fra : Tidemann


Dato : 31-01-06 13:42

"JH" skrev
>
> > Du kan også lave det som en popup ved mouseover, der kommer billedet frem
> > når
> > du peger.
> > Se her: http://www.dhejne.dk/winnie.shtml der gemmer du bare et billede!
> >
>
> Det er lige præcis det jeg er ude efter! Men hvad er
> fremgangsmåden/html-koden?
>

I din css sættes dette:

div#img {
position:relative;
margin:0
padding:0;
z-index: 100;
_top:20px; /* hack til IE */
}
div#img li {
padding: 0;
text-align:left;
margin-left: -20px;
list-style: none;
text-decoration: none;
}
div#img a:hover {
color: black;
background: white;
text-decoration: none;
}
div#img a span {display: none;}
div#img a:hover span, a:active span {
display: block;
position: absolute;
top: -180px;
left: 5%;
margin-left:60px;
padding: 0;
z-index: 100;
_top: -150px; /* hack til IE */
}

og i din html kode dette:

<div id="img">
<ul>
<li><a href="#">Peter eller hvad der skal stå..........
<span><img border="0" src="winnie_april.jpg" alt="" width="447" height="424"
/></span></a></li>
</ul>
</div>

Du skal selvfølgelig justere lidt på tallene, så de passer til din side.......
Skal du ha´flere under hinanden sætter du bare flere <li> med indhold </li>
ind


--
Venlig hilsen
Marianne
design af: - www.ragdollys-cat-link.dk - www.dhejne.dk
www.formdinfremtid.dk - www.royalmontana.dk



JH (31-01-2006)
Kommentar
Fra : JH


Dato : 31-01-06 13:44


> I din css sættes dette:
>
> div#img {
> position:relative;
> margin:0
> padding:0;
> z-index: 100;
> _top:20px; /* hack til IE */
> }
> div#img li {
> padding: 0;
> text-align:left;
> margin-left: -20px;
> list-style: none;
> text-decoration: none;
> }
> div#img a:hover {
> color: black;
> background: white;
> text-decoration: none;
> }
> div#img a span {display: none;}
> div#img a:hover span, a:active span {
> display: block;
> position: absolute;
> top: -180px;
> left: 5%;
> margin-left:60px;
> padding: 0;
> z-index: 100;
> _top: -150px; /* hack til IE */
> }
>
> og i din html kode dette:
>
> <div id="img">
> <ul>
> <li><a href="#">Peter eller hvad der skal stå..........
> <span><img border="0" src="winnie_april.jpg" alt="" width="447"
> height="424"
> /></span></a></li>
> </ul>
> </div>
>
> Du skal selvfølgelig justere lidt på tallene, så de passer til din
> side.......
> Skal du ha´flere under hinanden sætter du bare flere <li> med indhold
> </li>
> ind

Tak for det.... Jeg prøver!

Mvh

June



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

Månedens bedste
Årets bedste
Sidste års bedste