como hacer para q las secciones d mi pagina aparezcan en el index

Citar

Escrito el 26 Jun 2012 07:51 pm

Por ejemplo si hago click en contacto no quiero crear una pagina contacto quiero que aparezca en el index

Por serga

19 de clabLevel

Envíale un mensaje privado

Citar

Escrito el 26 Jun 2012 10:11 pm

bueno aqui tendrias que usar mucho jquery por que tendrias que jugar con el display:none de cada seccion por ejemplo tu en tu index vas hacer un contenedor padre y dentro de este tendrias que hacer un DIV por cada una de las secciones a cada DIV le vas a dar un ID y a ese ID en CSS le vas a poner la propiedad de display:none; asi cuando uses el menu principal solo le haras un FADEIN a ID de la seccion que escogiste y listo solo tendras que saber que seccion estaba activa para que la borre para eso tendrias que declarar una variable se me ocurre llamada currentSec y que esta almacene cual fue el ultimo btn que presionaste con el id de esa seccion y listo... facil no?

Por ldgmmorales

Claber

142 de clabLevel

1 tutorial

Genero:Masculino

Envíale un mensaje privado Web

@tuiteameaka

Citar

Escrito el 26 Jun 2012 10:13 pm

perdon la borras haciendo FADEOUT mas bien la ocultas no se borra sorry para que no se malentienda

Por ldgmmorales

Claber

142 de clabLevel

1 tutorial

Genero:Masculino

Envíale un mensaje privado Web

@tuiteameaka

Citar

Escrito el 26 Jun 2012 11:32 pm

ldgmmorales escribió:

perdon la borras haciendo FADEOUT mas bien la ocultas no se borra sorry para que no se malentienda

Gracias por responder! =)

Pero no se mucho Jquery, intente hacer lo que me dijiste pero no me salio.

Código HTML :

<body>
<div id="contenedor">
<a href="">caja1</a>
<a href="">caja2</a>
<a href="">caja3</a>
<div id="caja1"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi tincidunt rutrum accumsan. Sed aliquam facilisis dictum.</p></div>

<div id="caja2">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi tincidunt rutrum accumsan. Sed aliquam facilisis dictum.  </div>

<div id="caja3">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi tincidunt rutrum accumsan. Sed aliquam facilisis dictum.</div>
</div>

Código CSS :

#contenedor {width:1010px; margin-right: auto; margin-left: auto;}
#caja1 {display:none; width:200; height:200px;}
#caja2 {display:none; width:200; height:200px;}
#caja3 {display:none; width:200; height:200px;}

Código Javascript :

<script src="http://code.jquery.com/jquery-1.7.2.min.js"> </script>
<script type="text/javascript">
$(document).ready(function() {
                     
$("a").cilck(function() {
$("div").fadein("3000",0.5);

});
$("a").clickout(function() {
$("div").fadeout("3000",0.5);

});

});

</script>

Yo lo que quiero hacer es lo sieguiente, tengo una imagen en el centro de mi página, esta imagen tiene 2 personas a la izquierda y yo quiero que aparezca el contenido del menu a la derecha, el menu seria un menu basicoej Home - Nosotros - Servicios - etc. Espero que me puedas ayudar yo en mi pagina al menu lo hice en listas y esta en un div lo hice suelto como en el ejemplo que te mostre

Por serga

19 de clabLevel

Envíale un mensaje privado

Citar

Escrito el 26 Jun 2012 11:47 pm

si no hay pex mira... asi esta el show...

var currentBtn;

$('#btn_mision a, #btn_historia a, #btn_principios a')
.mouseover(function(){
if(currentBtn != $(this).attr("id")){

$(this).css({backgroundPosition:"0px -80px"})

}//end if
})
.mouseout(function(){
if(currentBtn != $(this).attr("id")){

$(this).css({backgroundPosition:"0px 0px"})

}//end if

}).click(function(){

if(currentBtn != $(this).attr("id")){

//alert(currentBtn)

$("#"+currentBtn).css({backgroundPosition: "0px 0px"});

currentBtn = $(this).attr("id");

$(this).css({backgroundPosition: "0px -80px"});

}//end if

}); //.click function

ahi te va tus href de tu menu principal tienen que llevar href="javascript:void(0)", porque si lo dejas asi vacio hara un reload o refresh o recarga de la pagina si le pones un # lo ke hara es que se movera el scroll del navegador si es que lo tienes porque busca un ancla,

bien si observas tengo $('#btn_mision a, #btn_historia a, #btn_principios a') aqui vas a opner el id de cad uno de tus botones si notas hago referencia a la etiqueta A y luego separo por medio de una coma el siguiente boton luego hay una variable declarada llamada currenBtn que es la que va almacenar el ID del boton que fue precionado en el evento click en esta instruccion currentBtn = $(this).attr("id"); ahora a cada una de las etiketas A de cada boton tendras que ponerle un el ID de la seccion pero asegurate de que no vaya a interferir con tus CSS que ya tienes, ahora estoy agregando el mouseover y el mouseout por si necesitas que el btn de tenga un rollover suponiendo que tienes un backgrounImagesn en cada etiqueta A ke mide 160px de altura ke incluye la imagen del btn normal y el btn del over... entonces solo cambio la posicion del background y con el IF me aseguro que solo lo ejecute en los btns que no estan seleccionados...

lo puedes ver en accion en este link http://www.dinamat-mh.com/main.php?seccion=nosotros los btones de historia, mision principios usa tu FIREBUG de FIREFOX o el explorador de chrome o el de safari no se que uses para previsualizar... jejeje voy al cine regresando checo si tuviste algun detalle Saludos!

Por ldgmmorales

Claber

142 de clabLevel

1 tutorial

Genero:Masculino

Envíale un mensaje privado Web

@tuiteameaka

como hacer para q las secciones d mi pagina aparezcan en el index

Escribe una respuesta rapida