link in div

Status
Niet open voor verdere reacties.
F

Frenske123

Terugkerende gebruiker
Lid geworden
2 jul 2007
Berichten
1.267
Hallo,

Maak een divje b,v 800x600px plaats er een evengrote afbeelding in (background-image)

vervolgens wil ik een link maken als men binnen de div klikt of op de achtergrond afbeelding


kan dit en hoe??? heb wat gezocht , maar kom er niet echt uit.
 
Bedoel je zoiets:

Code: 
 <style type="text/css" media="screen">
 body
{
background-image: url(start-strps.jpg);
margin: 0;
padding: 0;
font-family:  verdana, "comic sans ms", arial, hevetica, sans-serif;
text-align: left;
color: #000;
background: #ffffcc;
}
#muis
{
background-image: url(http://marth.web-log.nl/photos/uncategorized/2008/07/26/muis.jpg);
width: 550px; height: 388px;
}
.linken
{
padding-left: 50px;
}
</style>
</head>

<body >

<a href="http://www.zeelandnet.nl">
<div id="muis" >
<div class="linken"><br>
<a href="http://www.ford-world.nl">link 1</a><br><br>
<a href="">link 2</a><br><br>
<a href="">link 3</a><br><br></div>
</div>
</a>
</body>

</html>

:cool:
 
Bedankt ...maar niet wat ik bedoel

als je op de afbeelding binnen de div klikt moet dit een klik naar andere pagina zijn , of klikken binnen de div (waar de afbeelding als achtergrond wordt gebruikt..dus eigenlijk hetzelde
 
Frenske123 zei:
Bedankt ...maar niet wat ik bedoel

als je op de afbeelding binnen de div klikt moet dit een klik naar andere pagina zijn , of klikken binnen de div (waar de afbeelding als achtergrond wordt gebruikt..dus eigenlijk hetzelde
Klik om te vergroten...

..... heb je dus niet getest?

:cool:
 
jawel


Maar het klopt niet ...je hebt de a elementen niet goed afgesloten..er zitten fouten in de code

de link moet via (in) de div of de achtergrondafbeelding hiervan tot stand komen

jij hebt hem ::"gewoon in de body gezet"
 
En ditte:

Code: 
 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
   "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
	<title>(Type a title for your page here)</title>
<!--Pagina gemaakt op Friday, November 06, 2009 20:39:18 -->
<meta name="GENERATOR" content="Arachnophilia 4.0">
<meta name="FORMATTER" content="Arachnophilia 4.0">
<meta name="description"  content="korte beschrijving van de pagina">
<meta name="keywords"  content="trefwoorden, die, slaan, op, de, pagina">
<meta name="publisher" content="Jan Jansen">
<meta name="Author" content="Peter Vazed">
<meta name="robots" content="index, follow">
<meta name="revisit" content="7 days">
<meta http-equiv=content-type content="text/html; charset=windows-1252">
<meta http-equiv="Content-Style-Type" content="text/css">

<style type="text/css" media="all">
 @import url("zp.css"); 
</style>
		 
<LINK rel="stylesheet" type="text/css" href="zp.css">

 <style type="text/css" media="screen">
 body
{
background-image: url(start-strps.jpg);
margin: 0;
padding: 0;
font-family:  verdana, "comic sans ms", arial, hevetica, sans-serif;
text-align: left;
color: #000;
background: #ffffcc;
}
#muis
{
background-image: url(http://marth.web-log.nl/photos/uncategorized/2008/07/26/muis.jpg);
width: 550px; height: 388px;
}
.linken
{
padding-left: 50px;
}
</style>
</head>

<body >

<div id="muis" onclick="document.location.href='http://www.zeelandnet.nl'">
<div class="linken">
<br>
<a href="http://www.ford-world.nl">link 1</a><br><br>
<a href="">link 2</a><br><br>
<a href="">link 3</a><br><br>
</div>
</div>

</body>

</html>

:cool:
 
Dit werkt wel,,Bedankt:thumb:

nou nog een geschikte cursor erbij zoeken ..deze werkt niet in FF (hand)


cursor:hand;
 
Note on pointer and hand

In the past the hand value was Microsoft's way of saying pointer; and IE 5.0 and 5.5 only support hand. Because it's the cursor value that's used most often, most other browsers have also implemented hand.

Since IE 6 and 7 support pointer, there's no more reason to use hand, except when older IEs are part of your target audience. In that case, the only cross-browser syntax is:

element {
cursor: pointer;
cursor: hand;
}


zie:
http://www.quirksmode.org/css/cursor.html

:cool:
 
Okidoki........

images


:cool:
 
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan