13. juli 2001 - 11:21Der er
15 kommentarer og 3 løsninger
Simpel layer scroll problem
Jeg har lavet denne simple scroll funtion i et layer, og den virker fint, men man skal klikke for at få layeret til at flytte sig én pixel, og det holder ikke helt. Den skal reagere på mousedown og bare køre der ned af, og samme funktion for at få layeret op igen. function moveDown(id){ eval(layerRef + \'[\"\'+id+\'\"]\' + styleRef + \'.top=\"\' + moveCounter++ + \'\"\'); }
min moveCounter er sat til 0. Funktionen virker endnu ikke i netscape, at en eller anden grund kan netscape ikke accepter top som property...
Koden tilføjer scrollbars på css-laget, lidt ala scrollbars på frames. Hvis du skriver overflow:auto tilføjes scrollbars kun hvis indholdet kræver mere plads end width og heigt angiver.
Virker i IE, ved ikke om det virker i andre browsere.
Alternativ 2: Du vil kunne flytte lag.
Løsningen er ret kompliceret. Skriv hvis det er det du ønsker.
jeg skal bruge en løsning der ikke kun virker i en browser. Men det skal være simpelt. Jeg kender allerede tilsvarende dhtml løsning og har arbejdet en del med den, men det må kunne lade sig gøre at flytte ét lag uden at det kræver 5 siders kode.
<ole> Hvorfor opfinde hjulet én gang til? Brug dog geeeet\'s formidable scroller. Jeg tvivler på, du kan lave den bedre - eller blot ligeså god: http://www.ghtml.com/showoff/scrollbar/index.html /mvh </bole>
Din måde at \'tiltale\' IE på er i virkeligheden forældet. Den virker godt nok også i IE5.x, men det er usikkert, om den endelige IE6 vil kunne forstå \'document.all\'. Det har fra IE5.0 heddet \'document.getElementById\' - som det også hedder i NS6+. Din brug af eval() er helt hen i vejret, da det er en meget langsom ting at afvikle. Jeg tvivler også meget på din anvendelse af: moveCounter++. I så fald ville jeg i hvert fald sætte parentes omkring. Men som sagt: Brug geeeet\'s. Du har ikke niveauet til at gøre det bedre :) /mvh
<ole> Jeg er ikke ude på at opfinde den dybe tallerken igen, jeg har scripts lignende der kan give mig den løsning jeg er ude efter. Men det må kunne gøres lettere end at skulle bruge et stort bibliotek af scripts, så det er lige så meget et spørgsmål om at forbedre hvad der eksisterer allerede.
Grunden til at jeg har lavet moveCounter er bare en test ikke andet. Min init() function virker fint, men jeg er godt klar over at den er lavet med udgangspunkt i at IE bibeholder document.all. //Kris
jamen jamen jamen. Vi kan vel godt blive enige om at når vi snakker om hastighed og optimering så er dhtml noget af det der koster tid, og derfor mener jeg det er værd at forsøge at optimere denne slags script.
Jeg er helt enig i jeres holdning til tingene. Mit eget motto er \'hvis det virker, skal du ikke reparere det!\'
Fordelen ved geeeet\'s scroller er, at den er testet (og virker) i et hav af browsere. Han er en af mine gode kollegaer og jeg fulgte ham tæt under udviklingen og sparrede en del med ham. Jeg kan betro dig, at du løber ind i et hav af ting, du skal have rigtig meget erfaring for at løse...RIGTIG meget :o) Når du allerede her løber ind i problemer, er du ikke god nok - endnu. Det siger jeg ikke for at nedgøre dig, men for at være venlig mod dig :o) /mvh
I dit script (Kris) ser det ud til at du vil flytte laget og ikke noget med scrolle indholdet i laget. Dit script er næsten rigtig. Her er et der virker:
<html>
<SCRIPT LANGUAGE=\"javascript\">
//global variables var layerRef=\"null\",layerStyleRef=\"null\",styleSwitch=\"null\"; var lagleft=0; lagtop=0; function init(){ if (navigator.appName == \"Netscape\") { layerRef=\"document.layers\"; styleSwitch=\"\"; }else{ layerRef=\"document.all\"; styleSwitch=\".style\"; } } function moveLayerTo(layerName, lagleft, lagtop){ eval(layerRef+\'[\"\'+layerName+\'\"]\'+styleSwitch+\'.left = lagleft\'); eval(layerRef+\'[\"\'+layerName+\'\"]\'+styleSwitch+\'.top = lagtop\'); } </SCRIPT> </head> <body onLoad=\"init()\"> <div id=\"Layer1\" style=\"position:absolute; visibility:visible; left:36px; top:45px; width:130px; height:100px; z-index:1\">Dette er laget som skal flyttes.</div> <div id=\"Layer2\" style=\"position:absolute; visibility:visible; left:373px; top:46px; width:66px; height:41px; z-index:1\"> <a href=\"java script:moveLayerTo(\'Layer1\', 100, 100);\">Flyt lag</a> </div> </body> </html>
htorp og kong9 >> Virker ikke i NS6+ og formodentlig heller ikke i den kommende IE6. Derudover er eval() en meget processor krævende, langsom og derfor performance mæssig uegnet funktion at bruge til gentagen rekursion. Desuden skal det lag, der scrolles ligge i et lag med clip og overflow:hidden for at danne et \'vindue\', hvori der kan scrolles. Derfor vil objekt referencen til Layer1blive forkert i NS4.x. Det er yderst risky business at have flere lag med samme z-index.
Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.