Slachdot Menu

[Kikitten 0]

Bom agora é o meu menu da esquerda ... achei um script muito bom... mas a página explica muito pouco, e não sei pq não está funcionando. Até porque li o código fonte para entender um pouco... apenas mexi no css e nestas opções que creio era as que ele falava que podiamos customizar:

 

this.speed = 3;

this.markCurrent = true;

this.oneSmOnly = false;

 

Script Original aqui > Slashdot Menu

 

Pagina Teste

 

Estou usando este pois me cadastrei em 3 hosts grátis e eles nem abriam a index e mal funcionou o FTP... vai saber pq x.x'

 

Meu sdmenu.css modificado

 

Meu sdmenu.js modificado

 

Bom eu vou querer eles todos fechados, penso que devo colocar em todos

<div class="collapsed">		<span>Pesquisa</span>

Deixei o graduação aberto para verem o css funcionando.

Quando um menu abrir quero que o outro feche se estiver aberto... mas isso creio q é só mudar aqui this.oneSmOnly = false; para true. Embora eu ainda não esteja muito certa sobre isso... por causa disso

 

myMenu.speed = 3; // Menu sliding speed (1 - 5 recomended)

myMenu.remember = true; // Store menu states (expanded or collapsed) in cookie and restore later

myMenu.oneSmOnly = false; // One expanded submenu at a time

myMenu.markCurrent = true;

 

E só mais uma coisa... que não é tão importante quanto o resto... nesse site http://slashdot.org/ o último menu "Ads by Google" é apenas um link... ta ai você diz só por href... já tentei... ai ele fica que nem os submenus pq do css... fica esquisito.

 

Agradeceria se me ajudassem x.x e se quiserem ver meu pedido de ajuda no forum DD > Clique aqui!

[Kikitten 0]

Bom não consegui consertar arranjei um outro que também esconde o menu e consegui adaptar o css para ficar parecido... porém deu problema apenas no IE... vou postar a dúvida num novo tópico.

 

E aqui vou postar como está o novo menu...

 

O CSS modificado:

 

div.sdmenu {	width: 140px;	font-family: Verdana;	font-size: 12px;	padding-bottom: 9px;	background: url(bottom.gif) no-repeat  right bottom;	color: #2d5ea1;}div.sdmenu div {	background: url(title.gif) repeat-x;	overflow: hidden;}div.sdmenu div:first-child {	background: url(toptitle.gif) no-repeat;}.handcursor {	display: block;	padding: 5px 5px 5px 15px;	font-weight: bold;	color: #2d5ea1;	cursor: default;	border-bottom: 1px solid #007cc3;	}.link {	padding: 5px 7px;	background: #f5f8fd;	display: block;	border-bottom: 1px solid #007cc3;	color: #2d5ea1;	font-weight:bolder;	text-decoration:none;}div.sdmenu div .link:hover {	background : #ceddee url(linkarrow.gif) no-repeat right center;	color: #007cc3;	text-decoration: none;}

O novo script:

 

// -------------------------------------------------------------------// Switch Content Script- By Dynamic Drive, available at: http://www.dynamicdrive.com// Created: Jan 5th, 2007// April 5th: Added ability to persist content states by x days versus just session only// -------------------------------------------------------------------function switchcontent(className, filtertag){	this.className=className	this.collapsePrev=false //Default: Collapse previous content each time	this.persistType="none" //Default: Disable persistence	//Limit type of element to scan for on page for switch contents if 2nd function parameter is defined, for efficiency sake (ie: "div")	this.filter_content_tag=(typeof filtertag!="undefined")? filtertag.toLowerCase() : ""}switchcontent.prototype.setStatus=function(openHTML, closeHTML){ //PUBLIC: Set open/ closing HTML indicator. Optional	this.statusOpen=openHTML	this.statusClosed=closeHTML}switchcontent.prototype.setColor=function(openColor, closeColor){ //PUBLIC: Set open/ closing color of switch header. Optional	this.colorOpen=openColor	this.colorClosed=closeColor}switchcontent.prototype.setPersist=function(bool, days){ //PUBLIC: Enable/ disable persistence. Default is false.	if (bool==true){ //if enable persistence		if (typeof days=="undefined") //if session only			this.persistType="session"		else{ //else if non session persistent			this.persistType="days"			this.persistDays=parseInt(days)		}	}	else		this.persistType="none"}switchcontent.prototype.collapsePrevious=function(bool){ //PUBLIC: Enable/ disable collapse previous content. Default is false.	this.collapsePrev=bool}switchcontent.prototype.sweepToggle=function(setting){ //PUBLIC: Expand/ contract all contents method. (Values: "contract"|"expand")	if (typeof this.headers!="undefined" && this.headers.length>0){ //if there are switch contents defined on the page		for (var i=0; i<this.headers.length; i++){			if (setting=="expand")				this.expandcontent(this.headers[i]) //expand each content			else if (setting=="contract")				this.contractcontent(this.headers[i]) //contract each content		}	}}// -------------------------------------------------------------------// PUBLIC: defaultExpanded(indices_of_contents)- Set contents that should be expanded by default when the page loads.// Note that the persistence feature (if enabled) overrides this setting.// Pass in the position of the contents relative to the rest of the contents ie: defaultExpanded(0,2,3) would expand the 1st, 3rd, and 4th contents by default// -------------------------------------------------------------------switchcontent.prototype.defaultExpanded=function(){	var expandedindices=[] //Array to hold indices (position) of content to be expanded by default	//Loop through function arguments, and store each one within array	//Two test conditions: 1) End of Arguments array, or 2) If "collapsePrev" is enabled, only the first entered index (as only 1 content can be expanded at any time)	for (var i=0; (!this.collapsePrev && i<arguments.length) || (this.collapsePrev && i==0); i++)		expandedindices[expandedindices.length]=arguments[i]	this.expandedindices=expandedindices.join(",") //convert array into a string of the format: "0,2,3" for later parsing by script}//PRIVATE: Sets color of switch header.switchcontent.prototype.togglecolor=function(header, status){	if (typeof this.colorOpen!="undefined")		header.style.color=status}//PRIVATE: Sets status indicator HTML of switch header.switchcontent.prototype.togglestatus=function(header, status){	if (typeof this.statusOpen!="undefined")		header.firstChild.innerHTML=status}//PRIVATE: Contracts a content based on its corresponding header enteredswitchcontent.prototype.contractcontent=function(header){	var innercontent=document.getElementById(header.id.replace("-title", "")) //Reference content for this header	innercontent.style.display="none"	this.togglestatus(header, this.statusClosed)	this.togglecolor(header, this.colorClosed)}//PRIVATE: Expands a content based on its corresponding header enteredswitchcontent.prototype.expandcontent=function(header){	var innercontent=document.getElementById(header.id.replace("-title", ""))	innercontent.style.display="block"	this.togglestatus(header, this.statusOpen)	this.togglecolor(header, this.colorOpen)}// -------------------------------------------------------------------// PRIVATE: toggledisplay(header)- Toggles between a content being expanded or contracted// If "Collapse Previous" is enabled, contracts previous open content before expanding current// -------------------------------------------------------------------switchcontent.prototype.toggledisplay=function(header){	var innercontent=document.getElementById(header.id.replace("-title", "")) //Reference content for this header	if (innercontent.style.display=="block")		this.contractcontent(header)	else{		this.expandcontent(header)		if (this.collapsePrev && typeof this.prevHeader!="undefined" && this.prevHeader.id!=header.id) // If "Collapse Previous" is enabled and there's a previous open content			this.contractcontent(this.prevHeader) //Contract that content first	}	if (this.collapsePrev)		this.prevHeader=header //Set current expanded content as the next "Previous Content"}// -------------------------------------------------------------------// PRIVATE: collectElementbyClass()- Searches and stores all switch contents (based on shared class name) and their headers in two arrays// Each content should carry an unique ID, and for its header, an ID equal to "CONTENTID-TITLE"// -------------------------------------------------------------------switchcontent.prototype.collectElementbyClass=function(classname){ //Returns an array containing DIVs with specified classname	var classnameRE=new RegExp("(^|\\s+)"+classname+"($|\\s+)", "i") //regular expression to screen for classname within element	this.headers=[], this.innercontents=[]	if (this.filter_content_tag!="") //If user defined limit type of element to scan for to a certain element (ie: "div" only)		var allelements=document.getElementsByTagName(this.filter_content_tag)	else //else, scan all elements on the page!		var allelements=document.all? document.all : document.getElementsByTagName("*")	for (var i=0; i<allelements.length; i++){		if (typeof allelements[i].className=="string" && allelements[i].className.search(classnameRE)!=-1){			if (document.getElementById(allelements[i].id+"-title")!=null){ //if header exists for this inner content				this.headers[this.headers.length]=document.getElementById(allelements[i].id+"-title") //store reference to header intended for this inner content				this.innercontents[this.innercontents.length]=allelements[i] //store reference to this inner content			}		}	}}//PRIVATE: init()- Initializes Switch Content function (collapse contents by default unless exception is found)switchcontent.prototype.init=function(){	var instanceOf=this	this.collectElementbyClass(this.className) //Get all headers and its corresponding content based on shared class name of contents	if (this.headers.length==0) //If no headers are present (no contents to switch), just exit		return	//If admin has changed number of days to persist from current cookie records, reset persistence by deleting cookie	if (this.persistType=="days" && (parseInt(switchcontent.getCookie(this.className+"_dtrack"))!=this.persistDays))		switchcontent.setCookie(this.className+"_d", "", -1) //delete cookie	// Get ids of open contents below. Four possible scenerios:	// 1) Session only persistence is enabled AND corresponding cookie contains a non blank ("") string	// 2) Regular (in days) persistence is enabled AND corresponding cookie contains a non blank ("") string	// 3) If there are contents that should be enabled by default (even if persistence is enabled and this IS the first page load)	// 4) Default to no contents should be expanded on page load ("" value)	var opencontents_ids=(this.persistType=="session" && switchcontent.getCookie(this.className)!="")? ','+switchcontent.getCookie(this.className)+',' : (this.persistType=="days" && switchcontent.getCookie(this.className+"_d")!="")? ','+switchcontent.getCookie(this.className+"_d")+',' : (this.expandedindices)? ','+this.expandedindices+',' : ""	for (var i=0; i<this.headers.length; i++){ //BEGIN FOR LOOP		if (typeof this.statusOpen!="undefined") //If open/ closing HTML indicator is enabled/ set			this.headers[i].innerHTML='<span class="status"></span>'+this.headers[i].innerHTML //Add a span element to original HTML to store indicator		if (opencontents_ids.indexOf(','+i+',')!=-1){ //if index "i" exists within cookie string or default-enabled string (i=position of the content to expand)			this.expandcontent(this.headers[i]) //Expand each content per stored indices (if ""Collapse Previous" is set, only one content)			if (this.collapsePrev) //If "Collapse Previous" set			this.prevHeader=this.headers[i]  //Indicate the expanded content's corresponding header as the last clicked on header (for logic purpose)		}		else //else if no indices found in stored string			this.contractcontent(this.headers[i]) //Contract each content by default		this.headers[i].onclick=function(){instanceOf.toggledisplay(this)}	} //END FOR LOOP	switchcontent.dotask(window, function(){instanceOf.rememberpluscleanup()}, "unload") //Call persistence method onunload}// -------------------------------------------------------------------// PRIVATE: rememberpluscleanup()- Stores the indices of content that are expanded inside session only cookie// If "Collapse Previous" is enabled, only 1st expanded content index is stored// -------------------------------------------------------------------//Function to store index of opened ULs relative to other ULs in Tree into cookie:switchcontent.prototype.rememberpluscleanup=function(){	//Define array to hold ids of open content that should be persisted	//Default to just "none" to account for the case where no contents are open when user leaves the page (and persist that):	var opencontents=new Array("none")	for (var i=0; i<this.innercontents.length; i++){		//If persistence enabled, content in question is expanded, and either "Collapse Previous" is disabled, or if enabled, this is the first expanded content		if (this.persistType!="none" && this.innercontents[i].style.display=="block" && (!this.collapsePrev || (this.collapsePrev && opencontents.length<2)))			opencontents[opencontents.length]=i //save the index of the opened UL (relative to the entire list of ULs) as an array element		this.headers[i].onclick=null //Cleanup code	}	if (opencontents.length>1) //If there exists open content to be persisted		opencontents.shift() //Boot the "none" value from the array, so all it contains are the ids of the open contents	if (typeof this.statusOpen!="undefined")		this.statusOpen=this.statusClosed=null //Cleanup code	if (this.persistType=="session") //if session only cookie set		switchcontent.setCookie(this.className, opencontents.join(",")) //populate cookie with indices of open contents: classname=1,2,3,etc	else if (this.persistType=="days" && typeof this.persistDays=="number"){ //if persistent cookie set instead		switchcontent.setCookie(this.className+"_d", opencontents.join(","), this.persistDays) //populate cookie with indices of open contents		switchcontent.setCookie(this.className+"_dtrack", this.persistDays, this.persistDays) //also remember number of days to persist (int)	}}// -------------------------------------------------------------------// A few utility functions below:// -------------------------------------------------------------------switchcontent.dotask=function(target, functionref, tasktype){ //assign a function to execute to an event handler (ie: onunload)	var tasktype=(window.addEventListener)? tasktype : "on"+tasktype	if (target.addEventListener)		target.addEventListener(tasktype, functionref, false)	else if (target.attachEvent)		target.attachEvent(tasktype, functionref)}switchcontent.getCookie=function(Name){ 	var re=new RegExp(Name+"=[^;]+", "i"); //construct RE to search for target name/value pair	if (document.cookie.match(re)) //if cookie found		return document.cookie.match(re)[0].split("=")[1] //return its value	return ""}switchcontent.setCookie=function(name, value, days){	if (typeof days!="undefined"){ //if set persistent cookie		var expireDate = new Date()		var expstring=expireDate.setDate(expireDate.getDate()+days)		document.cookie = name+"="+value+"; expires="+expireDate.toGMTString()	}	else //else if this is a session only cookie		document.cookie = name+"="+value}

Como fica o menu na index :

 

<div class="sdmenu">	  <div id="bobcontent1-title" class="handcursor">Graduação</div><div id="bobcontent1" class="switchgroup1"><a class="link" href="curso.html" target="iframe">Curso</a>		<a class="link" href="#" target="iframe">Interdisciplinar</a>		<a class="link" href="#" target="iframe">Professores</a>		<a class="link" href="#" target="iframe">Grade Curricular</a>		<a class="link" href="#" target="iframe">Disciplina Eletiva</a>		<a class="link" href="#" target="iframe">Consultoria Jr.</a>		<a class="link" href="#" target="iframe">Monitoria</a>		<a class="link" href="#" target="iframe">Estágio Supervisionado</a>		</div><div id="bobcontent2-title" class="handcursor"><a href="#" style="text-decoration:none;">Pós-Graduação</a></div><div id="bobcontent2" class="switchgroup1"></div><div id="bobcontent3-title" class="handcursor">Pesquisa</div><div id="bobcontent3" class="switchgroup1"><a class="link" href="#" target="iframe">Destaque Acadêmico</a>		<a class="link" href="#" target="iframe">NUPEPU</a>		<a class="link" href="#" target="iframe">AAEA</a>		<a class="link" href="#" target="iframe">Ação Social</a></div>

o/

[hunternh 2]

http://hunternh.110mb.com/exemplos/menu_ferramentas2.html

[Kikitten 0]

Muito obrigada... vou testar depois ^_^