hola tengo una duda quiero hacer algo tipo esto miren aki les dejo el code:
Código HTML:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>Tabbed Menu</title>
<SCRIPT language="JavaScript">
<!--
var panelID = "p1"
var numDiv = 2
var numRows = 1
var tabsPerRow = 4
var numLocations = numRows * tabsPerRow
var tabWidth = 90
var tabHeight = 30
var vOffset = 8
var hOffset = 10
var divLocation = new Array(numLocations)
var newLocation = new Array(numLocations)
for(var i=0; i<numLocations; ++i) {
divLocation[i] = i
newLocation[i] = i
}
function getDiv(s,i) {
var div
if (document.layers) {
div = document.layers[panelID].layers[panelID+s+i]
} else if (document.all && !document.getElementById) {
div = document.all[panelID+s+i]
} else {
div = document.getElementById(panelID+s+i)
}
return div
}
function setZIndex(div, zIndex) {
if (document.layers) div.style = div;
div.style.zIndex = zIndex
}
function updatePosition(div, newPos) {
newClip=tabHeight*(Math.floor(newPos/tabsPerRow)+1)
if (document.layers) {
div.style=div;
div.clip.bottom=newClip; // clip off bottom
} else {
div.style.clip="rect(0 auto "+newClip+" 0)"
}
div.style.top = (numRows-(Math.floor(newPos/tabsPerRow) + 1)) * (tabHeight-vOffset)
div.style.left = (newPos % tabsPerRow) * tabWidth + (hOffset * (Math.floor(newPos / tabsPerRow)))
}
function selectTab(n) {
// n is the ID of the division that was clicked
// firstTab is the location of the first tab in the selected row
var firstTab = Math.floor(divLocation[n] / tabsPerRow) * tabsPerRow
// newLoc is its new location
for(var i=0; i<numDiv; ++i) {
// loc is the current location of the tab
var loc = divLocation[i]
// If in the selected row
if(loc >= firstTab && loc < (firstTab + tabsPerRow)) newLocation[i] = (loc - firstTab)
else if(loc < tabsPerRow) newLocation[i] = firstTab+(loc % tabsPerRow)
else newLocation[i] = loc
}
// Set tab positions & zIndex
// Update location
for(var i=0; i<numDiv; ++i) {
var loc = newLocation[i]
var div = getDiv("panel",i)
if(i == n) setZIndex(div, numLocations +1)
else setZIndex(div, numLocations - loc)
divLocation[i] = loc
div = getDiv("tab",i)
updatePosition(div, loc)
if(i == n) setZIndex(div, numLocations +1)
else setZIndex(div,numLocations - loc)
}
}
// Nav4: position component into a table
function positionPanel() {
document.p1.top=document.panelLocator.pageY;
document.p1.left=document.panelLocator.pageX;
}
if (document.layers) window.onload=positionPanel;
//-->
</SCRIPT>
<STYLE type="text/css">
<!--
.tab {
font-family: verdana ; font-size: 12px; cursor: hand; line-height:150%; font-weight: bold; position:absolute; text-align:center; border:2px; border-color:#999999; border-style:outset; border-bottom-style:none; width:90px; margin:0px; height: 30px;
}
.panel {
font-family: verdana; font-size: 12px; position:absolute; border: 2px; border-color:#999999; border-style:outset; width: 400px; height: 300px; left:0px; top:28px; margin:0px; padding:6px;
}
-->
</STYLE>
</head>
<body>
<ILAYER id="panelLocator" width="400" height="330"></ILAYER>
<NOLAYER>
<DIV id="p1" style="background-color: transparent; position: relative; width: 400px; height: 330px">
<DIV id="p1panel0" class="panel" style="background-color: #ffffee; z-index:2">
Panel 1
</DIV>
<DIV onclick="selectTab(0)" id="p1tab0" class="tab" style="background-color:#ffffee; left:0px; top:0px; z-index:2; clip:rect(0 auto 30 0)">
Sections</DIV>
<DIV id="p1panel1" class="panel" style="background-color: #ffffee; z-index:1">
Panel 2
</DIV>
<DIV onclick="selectTab(1)" id="p1tab1" class="tab" style="background-color:#ffffee; left:90px; top:0px; z-index:1; clip:rect(0 auto 30 0)">
Questions
</DIV>
</DIV>
</NOLAYER></body>
</html> quiero hacer lo mismo noma que este separado miren noce si me entienden por ej.:
mi web esta asi:
Código HTML:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
</head>
<body onLoad="ini()" onload="actualizaReloj()">
<div id="fondo">
<div id="contenido">
<div id="logo"></div>
<div id="menu" align="center">
<ul class="lavaLampWithImage" id="1">
<li><a href="#?Inicio">Inicio</a></li>
<li><a href="#?Musica">Musica</a></li>
<li><a href="#?Videos">Videos</a></li>
<li><a href="#?Peliculas Online">Peliculas Online</a></li>
<li><a href="#?Juegos PC">Juegos PC</a></li>
<li><a href="#?Juegos PS2">Juegos PS2</a></li>
</ul>
</div>
<div id="subcontenido">
<div id="subcontenido-derecha" >Bienvenidos</div>
<div id="subcontenido-izquierda">MenuSub1</div>
<div id="subcontenido-izquierda">MenuSub2</div>
<div id="subcontenido-izquierda">Publicidad</div>
</div>
<br />
</div>
</div>
<div id="pie">
<div id="tiempoderecarga">
<div align="center">Tiempo De Recarga: <span id="tmp">Cargando...</span>Segundos</div>
</div>
</div>
</body>
</html>
lo que quiero es poner en el DIV subcontenido-derecha el contenido que se va a mostrar
y arriba en el menu las opciones pero sin css y sin DIV solo quiero frace para que agan click y se cambie abajo
bueno espero que me ayuden
o aun mejor si tienen algo mas mejorado que eso les agradeceria que me lo pasaran
e visto en algunas paginas que ahy casi lo mismo noce como hacer pero se nota en la direcion que cambia ej. "index.php#parte1" - "index.php#parte2" "index.php#parte3" , pero al cambiar de secion desaparece la anterior
jaaja bueno espero que me entiendan y puedan ayudar
saludos Javascripteros