PDA

View Full Version : is this possible? if yes, how?



herotm
11-22-2008, 03:02 PM
Look at the pic,

http://i37.tinypic.com/fjqcyu.jpg

Is it possible when someone clicks on certain part of the browser page, they will go to a link?

coothead
11-22-2008, 05:59 PM
Hi there herotm,

is this possible?
Yes. ;)

if yes, how?
Like this...


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Style-Type" content="text/css">

<title></title>

<style type="text/css">
#container {
width:800px;
border:1px solid #000;
margin:auto;
background-color:#c0c0c0;
}
#header {
height:230px;
border-bottom:1px solid #000;
background-color:#808080;
}
#header a {
display:block;
line-height:230px;
font-size:1.5em;
color:#000;
text-align:center;
}
#container p {
margin:0;
padding:20px;
text-align:justify;
}
</style>

</head>
<body>

<div id="container">

<div id="header">
<a href="http://www.dynamicdrive.com/forums/">dynamicdrive.com forums</a>
</div>

<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Cras volutpat, purus ac
pellentesque adipiscing, mauris ligula convallis metus, vitae scelerisque nibh
orci quis mi. Cum sociis natoque penatibus et magnis dis parturient montes,
nascetur ridiculus mus. Curabitur porttitor aliquam libero. Quisque molestie ornare
sem. Nam euismod sem lacinia ipsum. In pharetra metus ut dolor cursus aliquam.
Maecenas eu ante quis enim tincidunt laoreet. Pellentesque varius nunc in ipsum
pulvinar sollicitudin. Nunc et mi. Donec auctor dignissim orci. Aliquam sed magna.
Pellentesque in dui. In eget elit. Praesent eu lorem.
</p>

</div>

</body>
</html>

coothead

herotm
11-22-2008, 08:02 PM
no no, that's not what i was referring to, sry for the poor explanation


nvm, i dono how to explain what i want, sry.

coothead
11-22-2008, 09:10 PM
Hi there herotm,

well if you don't want any text then change this...


#header a {
display:block;
line-height:230px;
font-size:1.5em;
color:#000;
text-align:center;
}

...to this...


#header a {
display:block;
height:230px;
}

...and this...


<a href="http://www.dynamicdrive.com/forums/">dynamicdrive.com forums</a>

...to this...


<a href="http://www.dynamicdrive.com/forums/"></a>

coothead

Snookerman
11-23-2008, 04:10 PM
Credit to coothead, I just simplified it a bit and put it all together in case you don't understand what he means:

<body>
<div id="wrapper">
<div id="header"><a href="http://www.google.com/firefox"></a></div>
<div id="body">The Browser Page</div>
</div>
</body>
Css:
<style type="text/css">
#wrapper {
width:800px;
}
#header {
background-color:#808080;
height:230px;
}
#header a {
display:block;
height:230px;
}
#body {
background-color:#bbbbbb;
height:320px;
}
</style>

Schmoopy
11-23-2008, 04:51 PM
Just a quick note, the two ways above work with elements you make in CSS, but if you're referring to "image maps", where you have an image and you want to make parts of it clickable, it's a totally different thing, you will want dreamweaver to make image maps if that is what you want to do, as trying to make image maps in notepad is very long and tedious.

codeexploiter
11-24-2008, 04:45 AM
You don't have to install DreamWeaver just for integrating an image map in your web page. Make use of this online tool (http://www.maschek.hu/imagemap/imgmap) for the same.

Hope this helps.