ugrás a tartalomhoz

javascript+css help

cerberodas · 2007. Jún. 17. (V), 23.03
Az a célom, hogy egy ablakban középen jelenjen meg a fix magasságú tartalom. Erre írtam egy java scriptet de nem akar működni. Már vagy 3 órája nézem és irogatok át rajta mindent, de nem megy sehogy:(
java scriptben totál kezdő vagyok szoval valószínüleg vagy valami kis hiba van vagy totálidan roszul csinálok valamit... Ha valaki tudna segítani azt nagyon megköszönném.



[colorer=<script language="javascript">]<script language="javascript">
var margin = getCSSRule('#main');
margin.style.margin-top = string((window.innerHeight-585)/2) + 'px';
</script>[/colorer]
 
1

CSS

janoszen · 2007. Jún. 17. (V), 23.46
Ezt puszta CSS-sel is meg tudod csinálni, nem kell ide javascript. Pontosan ugyanazt kell csináld, tehát valahogy így:

html, body
{
 height:100%;
}

body
{
 margin-top:50%;
}

#main
{
 height:582px;
 margin-top:-291px;
}
2

css

cerberodas · 2007. Jún. 18. (H), 01.01
köszönöm a gyors választ, de egy fülugró ablakban van az oldal, és ott sajnos ez nekem nem működött.
3

Fölugró?

janoszen · 2007. Jún. 18. (H), 08.53
Mi köze a fölugró ablakhoz? Az is elvileg egy HTML-t tölt be és arra kell ráapplikálni ezt a CSS-t.
4

fölugró

cerberodas · 2007. Jún. 18. (H), 12.19
bocs elnéztem, normál ablaknál se működött csak mivel kisebb az ablak magassága olyan felbontásnál aminél próbáltam kb középre jött ki. Egyszerűen az 50% nem az ablak közepén van.

módosítás:

Köszönöm a segítséget megoldottam végre... és nem értem mit szenvedtem vele ennyit tegnap:P ha úgy ahogy írtad nem is működött egy abszolut pozíciójú divet beraktam 50% ra és ahoz képes mozgatva a tartalmat már jó lett.
5

ha fix a méret, akkor egyszerű

Gixx · 2007. Jún. 19. (K), 09.04


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="hu">
  <head>
    <title>Teszt</title>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <meta http-equiv="content-style-type" content="text/css; charset=utf-8" />
    <meta http-equiv="content-script-type" content="text/javascript; charset=utf-8" />
    <meta http-equiv="content-language" content="hu" />
    <style type="text/css">
      html,body{width:100%;height:100%;margin:0;padding:0} /* erdemes mindig ezzel inditani */
      
      div#kozepre{
        position:absolute;
        width:500px !important;
        margin-left:-250px; /* a szelesseg fele */
        height:200px !important;
        margin-top:-100px; /* a magassag fele */
        top:50%;
        left:50%;
        overflow:auto; /* nem fog nyulni a tartalommal, nem mozdul el */
        border:1px solid #000000;
      }
    </style>
  </head>
  <body>
    <div id="kozepre"><p>ahoj</p></div>
  </body>
</html>