Jump to content


RicardoRodrigues

Member Since 12/01/2007
Offline Last Active 12/01/2007, 11:37
-----

Topics I've Started

Mudar Dimensao Menu

12/01/2007, 09:35

ola, bem estou terminando meu primeiro site e a unica coisa que falta é eu redimensionar esse menu http://designodesign...a.com/menu.html
ainda não sei javascript e não vou ter tempo de aprender para esse trabalho, eu preciso que ele fique numa div de 460px, mudei o divBg pra 460 mais ele continua nos extremos da tela, alguem ai sabe onde mudar pra ficar nesse resolução?
se alguem puder ajudar agradeço muito.
abraços.





<html>
<head>
<title>DHTMLCentral.com - Free Dynamic HTML Scripts - SideScrollMenu Demo</title>
<meta name="Author" content="Thomas Brattli (webmaster@dhtmlcentral.com)">
<META NAME="Generator" CONTENT="Designer:Thomas Brattli (www.bratta.com)">
<meta name="KeyWords" content="DHTML, HTML, Dynamic HTML, Javascript, Cascading Style Sheets, Cross-browser, Cross browser, Javascripts, DOM, Scripts, Free Scripts,menu,scrolling,animated,sidescrollmenu,bratta,arrows,">
<meta name="Description" content="Dynamic HTML Central - The ultimate place to find DHTML scripts, demos, tutorials and help.">
<style type="text/css">
body			 {background-color:#ffffff;}
#divMenu a	   {color:#999999; text-decoration:underline;}
#divMenu a:hover {color:#333333; text-decoration:underline;}

#divBg		   {position:absolute; z-index:10; width:2000px; left:0px; height:100px; clip:rect(0px 10px 10px 0px); visibility:hidden;}
#divMenu		 {position:absolute; z-index:11; left:11px; top:1px; color:#333333; font-size:13px; font-family:verdana,arial,helvetica,sans-serif; visibility:inherit;}
#divArrowLeft	{position:absolute; z-index:12; width:11px; height:20px; left:0px; top:0px; visibility:inherit;}
#divArrowRight   {position:absolute; z-index:12; width:11px; height:20px; top:0px; visibility:inherit;}
</style>
<script language="JavaScript" type="text/javascript">
/********************************************************************************
** 
SideScrollMenu
*   Copyright (C) 2001 <a href="/dhtmlcentral/thomas_brattli.asp">Thomas Brattli</a>
*   This script was released at DHTMLCentral.com
*   Visit for more great scripts!
*   This may be used and changed freely as long as this msg is intact!
*   We will also appreciate any links you could give us.
*
*   Made by <a href="/dhtmlcentral/thomas_brattli.asp">Thomas Brattli</a>  and modified by Michael van Ouwerkerk
********************************************************************************
*/

function lib_bwcheck(){ //Browsercheck (needed)
	this.ver=navigator.appVersion
	this.agent=navigator.userAgent
	this.dom=document.getElementById?1:0
	this.opera5=this.agent.indexOf("Opera 5")>-1
	this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom && !this.opera5)?1:0;
	this.ie6=(this.ver.indexOf("MSIE 6")>-1 && this.dom && !this.opera5)?1:0;
	this.ie4=(document.all && !this.dom && !this.opera5)?1:0;
	this.ie=this.ie4||this.ie5||this.ie6
	this.mac=this.agent.indexOf("Mac")>-1
	this.ns6=(this.dom && parseInt(this.ver) >= 5) ?1:0;
	this.ns4=(document.layers && !this.dom)?1:0;
	this.bw=(this.ie6 || this.ie5 || this.ie4 || this.ns4 || this.ns6 || this.opera5)
	return this
}
var bw=new lib_bwcheck()


/**************************************************************************
Variables to set.
***************************************************************************/
sLeft = 0		 //The left placement of the menu
sTop = 120		//The top placement of the menu
sMenuheight = 30  //The height of the menu
sArrowwidth = 11  //Width of the arrows
sScrollspeed = 20 //Scroll speed: (in milliseconds, change this one and the next variable to change the speed)
sScrollPx = 8	 //Pixels to scroll per timeout.
sScrollExtra = 15 //Extra speed to scroll onmousedown (pixels)

/**************************************************************************
Scrolling functions
***************************************************************************/
var tim = 0
var noScroll = true
function mLeft(){
	if (!noScroll && oMenu.x<sArrowwidth){
		oMenu.moveBy(sScrollPx,0)
		tim = setTimeout("mLeft()",sScrollspeed)
	}
}
function mRight(){
	if (!noScroll && oMenu.x>-(oMenu.scrollWidth-(pageWidth))-sArrowwidth){
		oMenu.moveBy(-sScrollPx,0)
		tim = setTimeout("mRight()",sScrollspeed)
	}
}
function noMove(){
	clearTimeout(tim);
	noScroll = true;
	sScrollPx = sScrollPxOriginal;
}
/**************************************************************************
Object part
***************************************************************************/
function makeObj(obj,nest,menu){
	nest = (!nest) ? "":'document.'+nest+'.';
	this.elm = bw.ns4?eval(nest+"document.layers." +obj):bw.ie4?document.all[obj]:document.getElementById(obj);
	   this.css = bw.ns4?this.elm:this.elm.style;
	this.scrollWidth = bw.ns4?this.css.document.width:this.elm.offsetWidth;
	this.x = bw.ns4?this.css.left:this.elm.offsetLeft;
	this.y = bw.ns4?this.css.top:this.elm.offsetTop;
	this.moveBy = b_moveBy;
	this.moveIt = b_moveIt;
	this.clipTo = b_clipTo;
	return this;
}
var px = bw.ns4||window.opera?"":"px";
function b_moveIt(x,y){
	if (x!=null){this.x=x; this.css.left=this.x+px;}
	if (y!=null){this.y=y; this.css.top=this.y+px;}
}
function b_moveBy(x,y){this.x=this.x+x; this.y=this.y+y; this.css.left=this.x+px; this.css.top=this.y+px;}
function b_clipTo(t,r,b,l){
	if(bw.ns4){this.css.clip.top=t; this.css.clip.right=r; this.css.clip.bottom=b; this.css.clip.left=l;}
	else this.css.clip="rect("+t+"px "+r+"px "+b+"px "+l+"px)";
}
/**************************************************************************
Object part end
***************************************************************************/

/**************************************************************************
Init function. Set the placements of the objects here.
***************************************************************************/
var sScrollPxOriginal = sScrollPx;
function sideInit(){
	//Width of the menu, Currently set to the width of the document.
	//If you want the menu to be 500px wide for instance, just
	//set the pageWidth=500 in stead.
	pageWidth = (bw.ns4 || bw.ns6 || window.opera)?innerWidth:document.body.clientWidth;
   
	//Making the objects...
	oBg = new makeObj('divBg')
	oMenu = new makeObj('divMenu','divBg',1)
	oArrowRight = new makeObj('divArrowRight','divBg')
   
	//Placing the menucontainer, the layer with links, and the right arrow.
	oBg.moveIt(sLeft,sTop) //Main div, holds all the other divs.
	oMenu.moveIt(sArrowwidth,null)
	oArrowRight.css.width = sArrowwidth;
	oArrowRight.moveIt(pageWidth-sArrowwidth,null)
   
	//Setting the width and the visible area of the links.
	if (!bw.ns4) oBg.css.overflow = "hidden";
	if (bw.ns6) oMenu.css.position = "relative";
	oBg.css.width = pageWidth+px;
	oBg.clipTo(0,pageWidth,sMenuheight,0)
	oBg.css.visibility = "visible";
}

//executing the init function on pageload if the browser is ok.
if (bw.bw) onload = sideInit;
</script>
</head>

<body marginleft="0" marginheight="0">
<!-- START DELETE -->
<div style="position:absolute; left:0; top:0"><a href="#" onclick="self.close(); return false"><img src="/images/logo.gif" width="165" height="54" alt="" border="0" alt="Click to close window"></a></div>

<br><br><br>
<!-- END DELETE -->

<div id="divBg">
	<div id="divMenu">
		<nobr>
		[<a href="#">link 1</a>]
		[<a href="#">link 2</a>]
		[<a href="#">link 3</a>]
		[<a href="#">link 4</a>]
		[<a href="#">link 5</a>] 
		[<a href="#">link 6</a>] 
		[<a href="#">link 7</a>] 
		[<a href="#">link 8</a>] 
		[<a href="#">link 9</a>] 
		[<a href="#">link 10</a>]
		[<a href="#">link 11</a>]
		[<a href="#">link 12</a>]
		[<a href="#">link 13</a>]
		[<a href="#">link 14</a>]
		[<a href="#">link 15</a>]
		[<a href="#">link 16</a>]
		[<a href="#">link 17</a>]
		[<a href="#">link 18</a>]
		[<a href="#">link 19</a>]
		[<a href="#">link 20</a>]
		[<a href="#">link 21</a>]
		[<a href="#">link 22</a>]
		[<a href="#">link 23</a>]
		[<a href="#">link 24</a>]
		[<a href="#">link 25</a>]
		[<a href="#">link 26</a>]
		[<a href="#">link 27</a>]
		[<a href="#">link 28</a>]
		[<a href="#">link 29</a>]
		[<a href="#">link 30</a>]
		</nobr>   
	</div>

	<div id="divArrowLeft"><a href="#" onmouseover="noScroll=false; mLeft()" onmouseout="noMove()" onclick="sScrollPx-=sScrollExtra; return false" onfocus="if(this.blur)this.blur()" onmousedown="sScrollPx+=sScrollExtra"><img src="arrowleft.gif" width="11" height="21" alt="" border="0"></a></div>
	<div id="divArrowRight"><a href="#" onmouseover="noScroll=false; mRight()" onmouseout="noMove()" onclick="sScrollPx-=sScrollExtra; return false" onfocus="if(this.blur)this.blur()" onmousedown="sScrollPx+=sScrollExtra"><img src="arrowright.gif" width="11" height="21" alt="" border="0"></a></div>
</div>



</body>
</html> 

IPB Skin By Virteq