PDA

Pogčedajte punu verziju : javaScrip + div


sirNemanjapro
02. 08. 2006., 03:09
Imam problem sa divovima.
Hteo sam kada predjem misem preko linka da mi se iznad pojavi mali tekstic o linku.

HTML strana

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

<html>

<head>

<title>PlumTS Inc. | web desing group</title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

<meta name="copyright" content="Copyright &copy; 2006. by PlumTS Inc.">

<meta name="description" content="Web dizajn grupa medju sljivama. PlumTS Inc.">

<meta name="keywords" content="web, design, plumts, plum, web design group, krcko, d3d4, sirneamnjapro">

<meta name="rating" content="General">

<meta name="robots" content="index, follow">

<meta name="author" content="Milos Dedijer">

<link rel="Shortcut Icon" href="favicon.ico">

<link rel="stylesheet" href="ptstyleb.css" type="text/css" media="screen">

<script language="Javascript">

<!--

function toggleDiv(id,flagit)

{

if (flagit=="1")

{

if (document.layers) document.layers[''+id+''].visibility = "show"

else if (document.all) document.all[''+id+''].style.visibility = "visible"

else if (document.getElementById) document.getElementById(''+id+'').style.visibility = "visible"

}

else

if (flagit=="0")

{

if (document.layers) document.layers[''+id+''].visibility = "hide"

else if (document.all) document.all[''+id+''].style.visibility = "hidden"

else if (document.getElementById) document.getElementById(''+id+'').style.visibility = "hidden"

}

}

//-->

</script>

<style type="text/css">#home, #onama, #pcapps, #webdiz, #port, #zaposao, #kontakt, #exitswitch {visibility: hidden; display: block; font-size: 10px; color: #333333; padding: 3px 0px 0px 5px;}</style>

</head>

<body>

<div class="head"></div>

<table class="menu_top" align="center" width="800" border="0" cellpadding="0" cellspacing="0">

<tr>

<td width="571">

<div id="home">Naslovna strana sajta...</div>

<div id="onama">Mi o nama...</div>

<div id="pcapps">Naše aplikacije za PC...</div>

<div id="webdiz">Da i to znamo da radimo...</div>

<div id="port">Naši radovi ( uglavnom :-) )...</div>

<div id="zaposao">Želite da radite kod nas?</div>

<div id="kontakt">Ovde nas možete naći...</div>

<div id="exitswitch">Ne dopadamo Vam se? :-(</div>

</td>

<td width="229"><div align="right" class="menu_name">- PlumTS Inc. - web design group -</div></td>

</tr>

</table>

<table width="800" border="0" align="center" cellpadding="0" cellspacing="0">

<tr>

<td width="800"><div class="menu_t2">| <a href="home.htm" onMouseOver="toggleDiv('home',1)" onMouseOut="toggleDiv('home',0)">PlumTS Inc.</a> | <a href="onama.htm" onMouseOver="toggleDiv('onama',1)" onMouseOut="toggleDiv('onama',0)">O nama</a> | <a href="pcapps.htm" onMouseOver="toggleDiv('pcapps',1)" onMouseOut="toggleDiv('pcapps',0)">PC Aplikacije</a> | <a href="webdiz.htm" onMouseOver="toggleDiv('webdiz',1)" onMouseOut="toggleDiv('webdiz',0)">Web dizajn</a> | <a href="port.htm" onMouseOver="toggleDiv('port',1)" onMouseOut="toggleDiv('port',0)">Portfolio</a> | <a href="zaposao.htm" onMouseOver="toggleDiv('zaposao',1)" onMouseOut="toggleDiv('zaposao',0)">Zaposlenje</a> | <a href="kontakt.htm" onMouseOver="toggleDiv('kontakt',1)" onMouseOut="toggleDiv('kontakt',0)">Kontakt</a> | <a href="exitswitch.htm" onMouseOver="toggleDiv('exitswitch',1)" onMouseOut="toggleDiv('exitswitch',0)">[ Exit ]</a> |</div></td>

</tr>

</table>

<table width="800" border="0" align="center" cellpadding="0" cellspacing="0">

<tr>

<td>

<table width="2px" border="0" cellspacing="0" cellpadding="0">

<tr>

<td><div class="page_body_left"></div></td>

</tr>

</table>

</td>

<td>

<table width="781px" border="0" cellspacing="0" cellpadding="0">

<tr>

<td><div class="page_body"></div></td>

</tr>

</table>

</td>

<td>

<table width="17" border="0" cellspacing="0" cellpadding="0">

<tr>

<td><div class="page_body_right"></div></td>

</tr>

</table>

</td>

</tr>

</table>

<div class="copy">[ Copyright &copy; 2006. PlumTS Inc. All rights reserved. We do design! ]</div>

</body>

</html>


CSS
/*

================================================== =====

Title: PlumTS Inc. CSS Styles

Version: 1.0

-------------------------------------------------------

File: ptstyleb.css

Type: text/css

Author: Nemanja A. Cosovic

-----------------------------

Modified:

================================================== =====

*/



body

{

font-family: Verdana, Arial, Helvetica, sans-serif;

color: #FFFFFF;

line-height: 1.166;

padding: 15px 0px 0px 0px;

background: url(img/sljbg.png) repeat;

margin-bottom: 8px;



}



a:link

{

text-decoration: none;

color: #CC9933;

}

a:visited

{

text-decoration: none;

color: #CC9933;

}

a:hover

{

text-decoration: none;

color: #FFFFFF;

}

a:active

{

text-decoration: none;

color: #CC9933;

}



.content

{

padding: 5px 5px 5px 5px;

vertical-align: top;

text-align: left;

}



.head

{

background: url(img/head.png) no-repeat;

background-position: center;

height: 119px;

border: 1px #000000;

}



/* ----------------------------- */

/* top menu */

/* ----------------------------- */

.menu_top

{

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 10px;

color: #CCCCCC;

background: url(img/bg_t1.png) no-repeat;

}



.menu_divz

{

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 10px;

text-align: left;

color: #333333;

padding: 3px 5px 6px 5px;

background: url(img/bg_t1.png) no-repeat;

}



.menu_name

{

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 10px;

text-align: right;

color: #999999;

padding: 3px 10px 6px 0px;

}



.menu_t2

{

font-family: Verdana, Arial, Helvetica, sans-serif;

font-size: 10px;

text-align: left;

color: #FFFFFF;

padding: 5px 0px 6px 5px;

background: #000000;

}



/* ----------------------------- */





/* ----------------------------- */

/* page body */

/* ----------------------------- */

.page_body

{

font-family: Arial, Helvetica, sans-serif;

font-size: 12px;

background: url(img/body_mid.png) repeat;

height: 482px;

width: 781px;

}



.page_body_left

{

background: url(img/body_left.png) no-repeat;

height: 482px;

width: 2px;

background-position: center;

}



.page_body_right

{

background: url(img/body_right.png) no-repeat;

height: 482px;

width: 17px;

background-position: center;

}



.plum_logo

{

background: url(img/body_plum.png) no-repeat;

background-position: right;

vertical-align: bottom;

height: 112px;

}



.copy

{

font-size: 10px;

color: #CCCCCC;

text-align: center;

padding-top: 5px;

}



/* ----------------------------- */

Kako to da resim?:1050:

bluesman
02. 08. 2006., 03:24
Koristi pretragu, imaš baš ovde na forumu gotov script za to što ti treba. Sam ne znam jel ti treba za div ili za link. U naslovu je jedno a u tekstu drugo.

borstale
02. 08. 2006., 07:26
http://www.bosrup.com/web/overlib/
I pretraga je nešto zaglupavila

xippi
02. 08. 2006., 09:38
http://www.devprotalk.com/showthread.php?t=87

setio sam se da sam ja trazio tako nesto ;)


makni tabele

borstale
02. 08. 2006., 10:42
A naravno i na CSSplay (http://www.cssplay.co.uk/menu/pop_ups.html) uvek može nešto da se nađe.

sirNemanjapro
05. 08. 2006., 22:13
Hocu da mi se tekst ispise za sve linkove na istom mestu. Prema ovoj skripti, sve sto zeli da se ispise mora da stane u div. Medjutim meni divovi prave zezanciju i prosiruju mi tabelu po visini. Tako da je pitanje i za jedno i drugo.

A offtopic za tabele.
Probao sam sa divovima, ali stvari previse lete unaokolo. Ne mogu lako da ih kontrolisem. Im just a padawan coder. :)

Br@nkoR
06. 08. 2006., 08:28
Hocu da mi se tekst ispise za sve linkove na istom mestu. Prema ovoj skripti, sve sto zeli da se ispise mora da stane u div. Medjutim meni divovi prave zezanciju i prosiruju mi tabelu po visini. Tako da je pitanje i za jedno i drugo.


Umesto visibility css osobine koristi display osobinu za skrivanje i pikazivanje div-ova sa tekstom, jer korišćenjem visibility css osobine oni su tu i dalje prisutni ali se ne vide i zato se proširuje ćelija tabele.