ugrás a tartalomhoz

div tartalmanak lapozasa javascripttel

efpe · 2008. Dec. 6. (Szo), 15.32
Hallo,

van egy fix magassagu divem. Nem szeretnem scrollbart gyartani, csak ha nincs mas megoldas. Szal, van a div, adott a magassaga. Ebben van sok szovegem, neha nagyobb, mint a div. Ehhez kene valami "pager", tehat ha a szoveg tullepi a magassagot, akkor felparsolni, a maradekot meg atrakni egy kovetkezo oldalra.

Van valakinek erre valami otlete? Nem nagyon jutok elorebb. Ha mashogy nem megy, akkor valami js cuccmakkal, pl scriptaculoussal epitek ra scrollbart.

Elore is koszi a segitseget,
efpe
‹ Form adatvisszaadás JS-el Folyamatos eltüntetés és megjelenítés... ›
 ■
1

Ne hiszem, hogy menni fog

rrd · 2008. Dec. 6. (Szo), 16.19
Ne hiszem, hogy menni fog mivel nem tudod lemérni a betűk magasságát. Mi van ha az ember nyom egy Ctrl +-t? Mi van ha nincs is olyan betűtípusa mint amire számolsz? Max valami olyasmit tudsz, hogy azt mondod, hogy kb 500 betű fér bele és ott vágod a lapozáshoz.
2

Jaja, en is ettol felek. Csak

efpe · 2008. Dec. 6. (Szo), 16.59
Jaja, en is ettol felek. Csak a design felepites miatt elegge butan nezne ki a scrollbar :)
3

Lehet hogy ez segit.

Dömcsi · 2008. Dec. 6. (Szo), 19.55
Ha a scrollbar zavar igy el lehet takarni:
<!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" lang="hu" >

<head>

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

	<title>Scroll</title>

</head>

<body>

<div style="position:relative; margin:10px; width:404px; height:404px;">


	<div style="position:absolute; top:2px; right:2px;  width: 20px; height:400px; z-index:200;background: #fff; font-size:1.3em;">
A g ö r d i t ö s á v  h e l y e
	</div>


     <div style="margin:0px; width:400px; height:400px;border: 2px solid black; font-size:3.5em; z-index: 100; overflow: auto;">s ghj xsfg sdtg gh ik fxgj gfj ghj gfj ghj fgxjkl  fgj gbjfg gjvb s  htdgzh zjz tgzj ftz rfz sxw tsxfgz jk xtz x  jghjd  dj dghj gdhj dgj  dgzj zgjh gfjhhg t th tzj zgj frtujh tzujh tz  jh jfgj  fgzj fgjfgj jg fj
    </div>


</div>


</body>

</html>
4

Lapozás legegyszerűbben javascripttel

Chupacabra · 2008. Dec. 7. (V), 01.23
1. Adott a dived, fix magassággal. Overflow értékét hiddenre állítod. Így a tartalom túllógó része nem látszik.

2. Csinálsz egy gombot, linket, bármit, és ahoz js-el hozzárendeled, hogy scrollozza lefele a dived tartalmát a látható magassággal

3. Ugyanezt felfele is.

nagyon nagy vonalakban:

<style type="text/css">
	#content {
		border: 1px solid red;
		height: 60px;
		overflow: hidden;
		line-height: 20px;
	}
</style>

...

<div id="content">
	1. sor<br />
	2. sor<br />
	3. sor<br />
	4. sor<br />
	5. sor<br />
	6. sor<br />
	7. sor<br />
	8. sor<br />
	9. sor<br />
	10. sor<br />
</div>

<a href="#" onclick="document.getElementById('content').scrollTop += 60;">lefele</a>
<a href="#" onclick="document.getElementById('content').scrollTop -= 60;">felfele</a>
Ha látni akarod hány oldalad van, az érdekesebb, nem tudom van-e olyan tulajdonság ami az overfolwolt div eredeti magasságát adja vissza. Így látatlanba úgy csinálnám hogy cssben a divet visibility: hiddenre állítom, majd jsből lekérdezem a magasságát, beállítom az overflow-t, és láthatóvá teszem. Ezután értelemszerűen kiszámolható hány lapozógombot kell megjeleníteni.

Ha nem akarsz tört sorokat, a div magasságának a line-height többszörösének kéne lennie szerintem.
5

wow, cool. Koszonom,

efpe · 2008. Dec. 7. (V), 14.56
wow, cool. Koszonom, valoszinu ez lesz a jo megoldas. Mekkora gyoker vagyok, hogy nem jutott eszembe ez :) Koszi a segitseget mindenkinek.