ugrás a tartalomhoz

görgető

mrksdm · 2009. Nov. 25. (Sze), 01.41
mivel a firefox nem kezeli a görgető szinére vonatkozó css kódot ezért azt szeretném megcsinálni h letiltom a görgő megjelenését az oldalon és egy kattintható gomb amit tudok formázni és azzal szeretném irányítani a görgetést.
találtam egy példát de ez csak hasonló mert ez automatikus és ez csak lefele csinálja:
http://www.ultimate-guitar.com/tabs/b/bullet_for_my_valentine/room_409_tab.htm
az oldal jobb oldalán lévő autoscroll doboz
ez mennyire megoldható?
sztem script be kellene valami írni de ahoz nem értek:S
‹ Hogyan design-oljam a submit,reset,és a button inputokat? menü probléma ›
 ■
1

Felejtsd el

Joó Ádám · 2009. Nov. 25. (Sze), 11.24
Egyrészt: ne akard megváltoztatni a görgetősáv színét. A görgetősáv nem része a weboldaladnak, a görgetősáv az én böngészőm része, és elég gyorsan felkapom a vizet, ha a böngészőmet cseszteted (értsd: nem fogom szeretni az oldalad).

Az pedig, hogy eltünteted a görgetősávot, aztán csinálsz sajátot, még jobban felidegesít (értsd: azonnal ott hagyom az oldalad).

Alapelv: ne duplikálj meglévő funkcionalitást; le pedig végképp ne cserélj, mert csak rosszabbat fogsz csinálni.
2

de így ha így hagyom nem

mrksdm · 2009. Nov. 25. (Sze), 13.14
de így ha így hagyom nem egységes az oldal mert egy egy iframe lenne és a fekete összhatást megtöri:S
3

belső görgetők :S

errata · 2009. Nov. 25. (Sze), 21.59
egyet értek az előttem szólóval, én is nehezményezem ha általam használt és jól beállított funkciókat felülbírálják, mindazonáltal a jQuery-hez vannak már elégé normális görgető pluginok javaslom ott keresgéljél, egy sima gomb nagyon nem lesz jó mert attól én is frász kapnék, gondolj bele te mivel görgetsz, gondolom az egered görgőével, vagy húzogatod a scroll-t, én már az idejét se tudom mikor kattintattam a két kicsi gombra, szóval ha ez a megoldást választod, javaslom mindenképpen egy teljes értékű scroolban gondolkozz ne pedig gombokban...
Amúgy miért pont iframe? nem ismerem az oldalt amit csinálsz de tapasztalataim szerint a legtöbb weboldalon iframe nélkül is megoldható az amit a fejlesztő iframmel csinált, ha nem szorít nagyon a határidő, esetleg érdemes elgondolkozni alternatív megoldásokon...
4

sikerült megoldani egy egész

mrksdm · 2009. Nov. 26. (Cs), 12.47
sikerült megoldani egy egész görgető sávot csináltam
így néz ki:

<html>

<head>
<title>Untitled Document</title>

<style type="text/css">

body {
background-color:#000000;
color:#FFCC00; margin:0px;
}

img {
border:0px;
padding:0px;
margin:0px;
}

div {
padding:0px;
margin:0px;
border:0px;
}

</style>

<script language="javascript">

var start = 0;

var eredeti = 0;

var tartheight=0;

var scrollpos=0;

document.onmousedown = OnMouseDown;

document.onmouseup = OnMouseUp;

function OnMouseDown(e) {
if (e == null) e = window.event;

var target = e.target
if (e.target == document.getElementById('nyilfel') && e != null) {
if (parseFloat(document.getElementById('scrollbar').style.top)-405/(tartheight-405)*50<0) {
document.getElementById('scrollbar').style.top="0px";
}
else if (parseFloat(document.getElementById('scrollbar').style.top)-405/(tartheight-405)*50>322) {
document.getElementById('scrollbar').style.top="322px";
}
else {
document.getElementById('scrollbar').style.top = parseFloat(document.getElementById('scrollbar').style.top)-405/(tartheight-405)*50 + 'px';
}
}

if (e.target == document.getElementById('nyille') && e != null) {
if (parseFloat(document.getElementById('scrollbar').style.top)+405/(tartheight-405)*50<0) {document.getElementById('scrollbar').style.top="0px";
}
else if (parseFloat(document.getElementById('scrollbar').style.top)+405/(tartheight-405)*50>322) {
document.getElementById('scrollbar').style.top="322px";
}
else { document.getElementById('scrollbar').style.top = parseFloat(document.getElementById('scrollbar').style.top)+405/(tartheight-405)*50 + 'px';
}
}

if (e.target == document.getElementById('scrollbar') && e != null) {
start = e.clientY;

eredeti = parseFloat(document.getElementById('scrollbar').style.top);

document.onmousemove = OnMouseMove;

document.body.focus();

document.onselectstart = function () { return false; };

target.ondragstart = function() { return false; };

return false;
}
}

function OnMouseMove(e) {
if (e == null) var e = window.event;

if ((eredeti + (e.clientY - start))<0) {
document.getElementById('scrollbar').style.top="0px";
}
else if ((eredeti + (e.clientY - start))>322) {
document.getElementById('scrollbar').style.top="322px";
}
else { document.getElementById('scrollbar').style.top = (eredeti + (e.clientY - start)) + 'px';
}
}

function OnMouseUp(e) {
document.onmousemove = null;

document.onselectstart = null;

document.getElementById('scrollbar').ondragstart = null;
}

function handle(delta) {
if (parseFloat(document.getElementById('scrollbar').style.top)-405/(tartheight-405)*delta<0) {
document.getElementById('scrollbar').style.top="0px";
}
else if (parseFloat(document.getElementById('scrollbar').style.top)-405/(tartheight-405)*delta>322) {
document.getElementById('scrollbar').style.top="322px"; }
else {
document.getElementById('scrollbar').style.top = parseFloat(document.getElementById('scrollbar').style.top)-405/(tartheight-405)*delta + 'px';
}
}

function wheel(event){
var delta = 0;

if (!event) event = window.event;

if (event.wheelDelta) {
if (window.opera) { delta = event.wheelDelta/25;
}
else { delta = event.wheelDelta/120;
}
}
else if (event.detail) {
delta = -event.detail/3;
}

if (delta)
handle(delta*10);
}

if (window.addEventListener)
window.addEventListener('DOMMouseScroll', wheel, false);

window.onmousewheel = document.onmousewheel = wheel;

function getHeight(element) {
element = document.getElementById(element);

var els = element.style;

var originalVisibility = els.visibility;

var originalPosition = els.position;

var originalDisplay = els.display;

els.visibility = 'hidden';

els.position = 'absolute';

els.display = 'block';

var originalHeight = element.offsetHeight;

els.display = originalDisplay;

els.position = originalPosition;

els.visibility = originalVisibility;

return originalHeight+25;
}

function scrolling() {
var szazalek=parseFloat(document.getElementById('scrollbar').style.top)/322;

var kesz=(2/tartheight-(tartheight-405)*szazalek);

scrollpos=(kesz-scrollpos)/10+scrollpos;

document.getElementById('tartalom').style.top=scrollpos+"px";

setTimeout("scrolling()",1);
}

function init() { tartheight=getHeight('tartalom');

scrolling();
}

</script>

</head>

<body onLoad="init()">


<div style="height:405px; width:665px; overflow:hidden; position: relative;background-image: url(bg.png);">

<div style="position:absolute; padding-left:10px; margin-top:15px; float:left; width:640px;text-align: justify;" id="tartalom">


<h2><center>Friss híreink:</center></h2>
<p align="justify">
a weblap fejlesztés alatt áll<br>
sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg, sok szöveg,
</p>

</div>

<div style=" position:relative; float:right; width:13px; height:405px; background-image:url(scrollsav.png); font-size:9px;" id="scroll">

<div style="position:relative; cursor:pointer; background-image:url(scroll.png); background-repeat:no-repeat; height:41px; top:0px;" id="scrollbar">
</div>

<div style="position:relative; cursor:pointer; background-image:url(nyilfel.png); background-repeat:no-repeat; height:21px; top:322px;" id="nyilfel">
</div>

<div style="position:relative; cursor:pointer; background-image:url(nyille.png); background-repeat:no-repeat; height:21px; top:322px;" id="nyille">
</div>

</div>

<div style="background-image:url(halvanyit.png); width:650px; height:25px; position:relative; top:380px;">
</div>

</div>

</body>

</html>

a képeket meg értelem szerüen meg kell szerkeszteni hozzá ami meg már nem nagy meló
ez müködik google chrome-val, firefox-al, safari-val. a többit nem teszteltem
remélem hasznára válik valakinek
5

Kódszínezés

Joó Ádám · 2009. Nov. 26. (Cs), 13.58
Legközelebb használd a kódszínezőt, és kevesebb felesleges helyet foglalj.
6

wave

gex · 2009. Nov. 26. (Cs), 20.40
Az pedig, hogy eltünteted a görgetősávot, aztán csinálsz sajátot, még jobban felidegesít (értsd: azonnal ott hagyom az oldalad).
google wave ugrott mi?
7

off

errata · 2009. Nov. 26. (Cs), 20.44
[off]
na igen az egy mintapélda arra hogyan csináljuk meg rosszul valamit...
értsd:
-bugos
-kicsi és nem követi az oldalt amit görget
-a gombok néha külön életet élnek
[/off]
8

Jó hogy mondod

Joó Ádám · 2009. Nov. 27. (P), 22.31
Gyűlölöm.