webForumDet fria alternativet

Snygg Scroller

7 svar · 524 visningar · startad av Hazze

HazzeMedlem sedan jan. 20001 891 inlägg
#1

Hejsan!
Hur gör man en sån där snygg scroller som finns på www.paregos.se/me? Har sett den på många ställen och den är snygg!

------------------
// Hazze

mikeMedlem sedan mars 2000191 inlägg
#2

Ja, det skulle jag också bra gärna vilja veta! Jag har prövat massor av gånger men aldrig lyckats :(.

------------------
Flax on /Mikael

HazzeMedlem sedan jan. 20001 891 inlägg
#3

Jaså, var du hittat den då?

Mr NilsMedlem sedan jan. 2000554 inlägg
#4

Hmm, om ni menar den där scrollbar saken, så finns bra och enkla exempel på: http://www.dansteinman.com/dynduo/

/Nils Wikberg

mikeMedlem sedan mars 2000191 inlägg
#5

jag fattar fortfarande inte, kan ingen bara lägga ut koden för en scrollbar, där man bara behöver lägga in sina bilders SRC på respektive platser?

------------------
Flax on /Mikael

MattiMedlem sedan dec. 19993 781 inlägg
#6

Mike, här har du:

<html>
<head>
	<title>Cross-browser Dynamic HTML Scripts - ScrollText</title>
<style type="text/css">
#divUp{position:absolute; left:170; top:190}
#divDown{position:absolute; left:170; top:380}
#divCont{position:absolute; width:300; height:150; overflow:hidden; top:220; left:170; clip:rect(0,300,150,0); visibility:hidden}
#divText{position:absolute; top:0; left:0}
</style>
<script type="text/javascript" language="JavaScript">
/********************************************************************************
Copyright (C) 1999 Thomas Brattli
This script is made by and copyrighted to Thomas Brattli at [url="http://www.bratta.com"]www.bratta.com[/url] 
Visit for more great scripts. This may be used freely as long as this msg is intact!
I will also appriciate any links you could give me.
********************************************************************************/
//Default browsercheck, added to all scripts!
function checkBrowser(){
	this.ver=navigator.appVersion
	this.dom=document.getElementById?1:0
	this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom)?1:0;
	this.ie4=(document.all && !this.dom)?1:0;
	this.ns5=(this.dom && parseInt(this.ver) >= 5) ?1:0;
	this.ns4=(document.layers && !this.dom)?1:0;
	this.bw=(this.ie5 &#0124; &#0124; this.ie4 &#0124; &#0124; this.ns4 &#0124; &#0124; this.ns5)
	return this
}
bw=new checkBrowser()
/*****************

You set the width and height of the divs inside the style tag, you only have to
change the divCont, Remeber to set the clip the same as the width and height.
You can remove the divUp and divDown layers if you want. 
This script should also work if you make the divCont position:relative.
Then you should be able to place this inside a table or something. Just remember
that Netscape crash very easily with relative positioned divs and tables.

Updated with a fix for error if moving over layer before pageload.

****************/

//If you want it to move faster you can set this lower:
var speed=50

//Sets variables to keep track of what's happening
var loop, timer

//Object constructor
function makeObj(obj,nest){
    nest=(!nest) ? '':'document.'+nest+'.'
	this.el=bw.dom?document.getElementById(obj):bw.ie4?document.all[obj]:bw.ns4?eval(nest+'document.'+obj):0;
  	this.css=bw.dom?document.getElementById(obj).style:bw.ie4?document.all[obj].style:bw.ns4?eval(nest+'document.'+obj):0;
	this.scrollHeight=bw.ns4?this.css.document.height:this.el.offsetHeight
	this.clipHeight=bw.ns4?this.css.clip.height:this.el.offsetHeight
	this.up=goUp;this.down=goDown;
	this.moveIt=moveIt; this.x; this.y;
    this.obj = obj + "Object"
    eval(this.obj + "=this")
    return this
}
function moveIt(x,y){
	this.x=x;this.y=y
	this.css.left=this.x
	this.css.top=this.y
}

//Makes the object go up
function goDown(move){
	if(this.y>-this.scrollHeight+oCont.clipHeight){
		this.moveIt(0,this.y-move)
			if(loop) setTimeout(this.obj+".down("+move+")",speed)
	}
}
//Makes the object go down
function goUp(move){
	if(this.y<0){
		this.moveIt(0,this.y-move)
		if(loop) setTimeout(this.obj+".up("+move+")",speed)
	}
}

//Calls the scrolling functions. Also checks whether the page is loaded or not.
function scroll(speed){
	if(loaded){
		loop=true;
		if(speed>0) oScroll.down(speed)
		else oScroll.up(speed)
	}
}

//Stops the scrolling (called on mouseout)
function noScroll(){
	loop=false
	if(timer) clearTimeout(timer)
}
//Makes the object
var loaded;
function scrollInit(){
	oCont=new makeObj('divCont')
	oScroll=new makeObj('divText','divCont')
	oScroll.moveIt(0,0)
	oCont.css.visibility='visible'
	loaded=true;
}
//Call the init on page load
onload=scrollInit;
</script>
</HEAD>
<BODY bgcolor="White">
<div id="divUp">
	<a href="#" onmouseover="scroll(-2)" onmouseout="noScroll()">[slow]</a>
	<a href="#" onmouseover="scroll(-7)" onmouseout="noScroll()">[medium]</a>
	<a href="#" onmouseover="scroll(-10)" onmouseout="noScroll()">[fast]</a>
</div>

<div id="divDown">
	<a href="#" onmouseover="scroll(2)" onmouseout="noScroll()">[slow]</a>
	<a href="#" onmouseover="scroll(7)" onmouseout="noScroll()">[medium]</a>
	<a href="#" onmouseover="scroll(10)" onmouseout="noScroll()">[fast]</a>
</div>

<div id="divCont">
	<div id="divText">
		<p>News: <br>
	 [url="http://www.bratta.com/dhtml"]www.bratta.com/dhtml[/url]  - Have you ever experienced DHTML is now updated
		with more script, demos and how to's then ever. Visit now!
		Also added: The DHTML Scriptomania, a new and better interface
		to browser the scripts, demos and how to's.</p>
		<p>
		test text test text test text test text test text test text<br><br>
		test text test text test text test text test text test text<br>
		test text test text test text test text test text test text<br>
		test text test text test text test text test text test text<br>
		test text test text test text test text test text test text<br></p>
		<p>
		test text test text test text test text test text test text<br>
		test text test text test text test text test text test text<br>
		test text test text test text test text test text test text<br><br>
		test text test text test text test text test text test text<br>
		test text test text test text test text test text test text - END</p>
	</div>
</div>

YOUR REGULAR BODY CONTENT GOES IN HERE
</BODY>
</HTML>

Från bratta.com.

------------------
Matti Kolu
www.mk.st

pellsäterMedlem sedan aug. 2000533 inlägg
#7

HIttade en kod för en scroller, men raden nästlängst ner bland de rader som testar vilken browser man har orsakar scriptfel. Om man tar bort den raden funkar det utmärkt i IE men inte i Netscape. Finns det någon expert som vet varför??

spangoMedlem sedan juni 20006 147 inlägg
#8

Asså... om nån undrar över min åsikt, kan jag bara meddela allmänheten om att dhtml-rullister suger skit! De är bra mycket mer opraktiska än vanliga rullister... alldeles för sega eller alldeles för snabba.
Skippa scrollern...

------------------
-- spango
Ibland är inte allt som man tror, sa Puh.
Kan du inte bara hålla käften, svarade Nasse.

Genererad på 495 ms · cache AV · v20260730165559-full.f96bc7eb