[Resolvido] Sempre clico no link e vai para o topo ¬¬

kreator · Maio 7, 2009

opa galera beleza to desenvolvendo um site!!!

e tem uma parte onde estou montando uma galeria de imagens via php e css!!!

o problema e q quando clico num link ele sobre ele vai para o topo do site,e eu quera q permanecece no lugar onde esta só acionando a outra imagem!!!

acho q faz isso com javascript!!!?????

alguém pode dar um help ai http://forum.imasters.com.br/public/style_emoticons/default/assobiando.gif

desde já agradeço http://forum.imasters.com.br/public/style_emoticons/default/joia.gif

Thiago Retondar · Maio 7, 2009

Coloque um link ou o XHTML e CSS. http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

kreator · Maio 7, 2009

Coloque um link ou o XHTML e CSS. http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

opa tiagão beleza http://forum.imasters.com.br/public/style_emoticons/default/joia.gif

q tipo de link???

kreator · Maio 7, 2009

os codes!!

menu_produtos.php

<div id="titulo_menu_produtos">CATEGORIAS</div><!-- menu produto 1 -->

<div id="menu_produto_1">

<ul>
<li><a href="?pg=menu camisetas">CAMISETAS</a></li>
</ul>
</div><!-- menu produto 1 -->

<div id="menu_produto_2">
<ul>
<li><a href="?pg=menu canecas">CANECAS</a></li>
</ul>
</div><!-- menu produto 2 -->

<div id="menu_produto_3">
<ul>
<li><a href="?pg=menu babadores">BABADORES</a></li>
</ul>
</div><!-- menu produto 3 -->

<div id="menu_produto_4">
<ul>
<li><a href="?pg=menu mouse pads">MOUSE PADS</a></li>
</ul>
</div><!-- menu produto 4 -->

<div id="menu_produto_5">
<ul>
<li><a href="?pg=menu quebra cabecas">QUEBRA CABEÇAS</a></li>
</ul>
</div><!-- menu produto 5 -->


<div id="menu_produto_7">
<ul>
<li><a href="?pg=aventais">AVENTAIS</a></li>
</ul>
</div><!-- menu produto 7 -->

<div id="menu_produto_8">
<ul>
<li><a href="?pg=estampas">ESTAMPAS</a></li>
</ul>
</div><!-- menu produto 8 -->

camisetas.php

include "css.php";
?>

<body>

<div id="fundo_paginas"></div><!-- fundo_paginas --> 

<?
include "banner_topo.php";
?>

<?
include "banner_empresa_escola.php";
?>

<div id="conteudo">

<div id="titulo_camisetas">CAMISETAS</div><!-- titulo entrega --> 

<div id="foto_camiseta1_ampliada"></div><!-- foto camiseta1 ampliada -->

</div><!-- conteudo -->

<?
include "menu_principal.php";
?>


 

<?
include "menu_produtos.php";
?>





</body>
</html>

GabrielFerrari · Maio 7, 2009

Cara fiquei meio confuso mas você quer algo assim:

http://www.sunsean.com/idTabs/

kreator · Maio 7, 2009

opa Thelon beleza http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

na verdade não são abas,tem uma imagem grande de exibição e varios produtos pequenos em baixo,clicando em um produto pequeno subistitui a imagem grande com a imagem que escolhi!!

o problema e q quando clico em um link pequeno ele sobre ao topo pois tem barra de rolagem na vertical no site se não tivesse ocorreria corretamente!!

Thiago Retondar · Maio 7, 2009

Coloque um link do seu site, mesmo que esteja em um servidor gratuito, ou co código XHTML e CSS. http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

kreator · Maio 7, 2009

Coloque um link do seu site, mesmo que esteja em um servidor gratuito, ou co código XHTML e CSS. http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

opa tiago estou testando no wamp server,quando ele estiver concluido colocarei no ftp!!!

acabarei de concluir algumas coisas aqui no code e já posto!!!

kreator · Maio 7, 2009

opa fiz correndo os liks para vcs me darem uma força!!!

camisetas.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>.::BULLDOG PRESENTES ::.</title>
</head>

<?
include "css.php";
?>

<body>

<div id="fundo_paginas"></div><!-- fundo_paginas --> 

<?
include "banner_topo.php";
?>

<?
include "banner_empresa_escola.php";
?>

<div id="conteudo">

<div id="titulo_camisetas">CAMISETAS</div><!-- titulo entrega --> 

<div id="foto_camiseta1_ampliada"></div><!-- foto camiseta1 ampliada -->

<div id="foto_escolha1">
<ul>
<li><a href="#"></a></li>
</ul>
</div><!-- foto escolha1 -->

<div id="foto_escolha2">
<ul>
<li><a href="#"></a></li>
</ul>
</div><!-- foto escolha2 -->

<div id="foto_escolha3">
<ul>
<li><a href="#"></a></li>
</ul>
</div><!-- foto escolha3 -->

<div id="foto_escolha4">
<ul>
<li><a href="#"></a></li>
</ul>
</div><!-- foto escolha4 -->

</div><!-- conteudo -->

<?
include "menu_principal.php";
?>


 

<?
include "menu_produtos.php";
?>





</body>
</html>

paginas.css

@charset "utf-8";
/* CSS Document */
 
 /********************************************************************************
************************/
/********************************************************************************
************************/
/**************************************** ESTRUTURA DO SITE *********************************************/
/********************************************************************************
************************/
/********************************************************************************
************************/

 
 
 
 
		  /******************************************************************/
		  /*************************** HOME.PHP *****************************/
		  /******************************************************************/
		 
		 /*************************** FUNDO PAGINAS*************************/


#fundo_paginas{ width:983px;
height:1000px;
background:#FFF;
position:absolute;
z-index:1;
}
		   /*************************** FIM DO PAGINAS*************************/

		   
		   
		   
		   /*************************** BANNER TOPO *************************/
#banner_topo{
background-color:#a7f7b8;
margin-left:10px;
height:111px;
width:957px;
margin-top:10px;
border:0px solid #F00;
position:absolute;
z-index:2;
}

#logo_banner_topo{ background-image:inherit; background: url(../png/logo%20bulldog.png) no-repeat;
height:130px;
width:221px;
padding-top:3px;
position:absolute;
z-index:3;
}
			   /***************************FIM DO BANNER TOPO *************************/
			   
			   
			   
			   /*************************** MENU PRINCIPAL *************************/
#menu_principal{
position:absolute;
margin-left:150px;
margin-top:128px;
z-index:4;
}

#menu_principal ul li {
	display:inline;
	float:left;
}
			   
#menu_principal ul li a { text-decoration:none; 
	font-family: "Bell Gothic Std" ,Verdana, Geneva, sans-serif;
	font-size: 17px;
	color: #8a7854;
	border:0px solid #F00; 
	float:left;
}

#menu_principal ul li a:hover{ color:#D2C7AC;}

#pingo{ color:#FFF;}
			   
			   
			   
			   /*************************** FIM DO MENU PRINCIPAL *************************/
			   
			   


			   /***************************  TITULO MENU PRODUTOS  *******************************/

#titulo_menu_produtos{ 
width:107px;
height:15px;
position:absolute;
z-index:5;
border:0px solid #F00;
margin-top:170px;
margin-left:30px;
font-family:"Arial Black" ,Verdana, Geneva, sans-serif;
font-size: 14px;
}



			   /*************************** FIM TITULO MENU PRODUTOS  *******************************/
 
			   /*************************** BOTÃO MENU PRODUTO 1*******************************/

 
 
#menu_produto_1{ 
width:107px;
height:29px;
position:absolute;
z-index:6;
border:0px solid #F00;
margin-top:190px;
margin-left:30px;
background:#8a7854;
}

#menu_produto_1 ul li{ display: inline;
border:0px solid #F00;
text-align: center;
position:absolute;

}

#menu_produto_1 ul li a{ font-family:"Arial Narrow" ,Verdana, Geneva, sans-serif;
font-size:14px;
text-decoration:none;
color:#FFF;
border:0px solid #F00;
position:absolute;
margin-left:-35px;
margin-top:5px;
}

#menu_produto_1 ul li a:hover{ color: #FC9;}
				/***************************FIM DO BOTÃO MENU PRODUTO 1*******************************/

				 /*************************** BOTÃO MENU PRODUTO 2*******************************/


#menu_produto_2{ 
width:107px;
height:29px;
position:absolute;
z-index:7;
border:0px solid #F00;
margin-top:220px;
margin-left:30px;
background:#8a7854;
}

#menu_produto_2 ul li{ display: inline;
border:0px solid #F00;
text-align: center;
position:absolute;

}

#menu_produto_2 ul li a{ font-family:"Arial Narrow" ,Verdana, Geneva, sans-serif;
font-size:14px;
text-decoration:none;
color:#FFF;
border:0px solid #F00;
position:absolute;
margin-left:-35px;
margin-top:5px;
}

#menu_produto_2 ul li a:hover{ color: #FC9;}
				  /***************************FIM DO BOTÃO MENU PRODUTO 2*******************************/

				  /*************************** BOTÃO MENU PRODUTO 3*******************************/

#menu_produto_3{ 
width:107px;
height:29px;
position:absolute;
z-index:8;
border:0px solid #F00;
margin-top:250px;
margin-left:30px;
background:#8a7854;
}

#menu_produto_3 ul li{ display: inline;
border:0px solid #F00;
text-align: center;
position:absolute;

}

#menu_produto_3 ul li a{ font-family:"Arial Narrow" ,Verdana, Geneva, sans-serif;
font-size:14px;
text-decoration:none;
color:#FFF;
border:0px solid #F00;
position:absolute;
margin-left:-35px;
margin-top:5px;
}

#menu_produto_3 ul li a:hover{ color: #FC9;}
				   /***************************FIM DO BOTÃO MENU PRODUTO 3*******************************/

					/*************************** BOTÃO MENU PRODUTO 4*******************************/

#menu_produto_4{ 
width:107px;
height:29px;
position:absolute;
z-index:9;
border:0px solid #F00;
margin-top:280px;
margin-left:30px;
background:#8a7854;
}

#menu_produto_4 ul li{ display: inline;
border:0px solid #F00;
position: absolute;

}

#menu_produto_4 ul li a{ font-family:"Arial Narrow" ,Verdana, Geneva, sans-serif;
font-size:11px;
text-decoration:none;
color:#FFF;
border:0px solid #F00;
position:absolute;
margin-left:-35px;
margin-top:5px;


}

#menu_produto_4 ul li a:hover{ color: #FC9;}

				  /***************************FIM DO BOTÃO MENU PRODUTO 4*******************************/
 
				   /*************************** BOTÃO MENU PRODUTO 5*******************************/
#menu_produto_5{ 
width:107px;
height:29px;
position:absolute;
z-index:10;
border:0px solid #F00;
margin-top:310px;
margin-left:30px;
background:#8a7854;
}

#menu_produto_5 ul li{ display: inline;
border:0px solid #F00;
position: absolute;

}

#menu_produto_5 ul li a{ font-family:"Arial Narrow" ,Verdana, Geneva, sans-serif;
font-size:9px;
text-decoration:none;
color:#FFF;
border:0px solid #F00;
position:absolute;
margin-left:-35px;
margin-top:5px;
float:left;


}

#menu_produto_5 ul li a:hover{ color: #FC9;}
				 /***************************FIM DO BOTÃO MENU PRODUTO 5*****************************/

				  
					
					 /*************************** BOTÃO MENU PRODUTO 7*******************************/

#menu_produto_7{ 
width:107px;
height:29px;
position:absolute;
z-index:12;
border:0px solid #F00;
margin-top:340px;
margin-left:30px;
background:#8a7854;
}

#menu_produto_7 ul li{ display: inline;
border:0px solid #F00;
position: absolute;

}

#menu_produto_7 ul li a{ font-family:"Arial Narrow" ,Verdana, Geneva, sans-serif;
font-size:13px;
text-decoration:none;
color:#FFF;
border:0px solid #F00;
position:absolute;
margin-left:-35px;
margin-top:5px;


}

#menu_produto_7 ul li a:hover{ color: #FC9;}

					   /*************************** BOTÃO MENU PRODUTO 8*******************************/
#menu_produto_8{ 
width:107px;
height:29px;
position:absolute;
z-index:13;
border:0px solid #F00;
margin-top:370px;
margin-left:30px;
background:#8a7854;
}

#menu_produto_8 ul li{ display: inline;
border:0px solid #F00;
position: absolute;

}

#menu_produto_8 ul li a{ font-family:"Arial Narrow" ,Verdana, Geneva, sans-serif;
font-size:14px;
text-decoration:none;
color:#FFF;
border:0px solid #F00;
position:absolute;
margin-left:-35px;
margin-top:5px;


}

#menu_produto_8 ul li a:hover{ color: #FC9;}


				/***************************FIM DO BOTÃO MENU PRODUTO 8*******************************/
			   
			   


			   /*************************** BANNER TOPO 2  *******************************/
			   
#banner_topo_2{
background-color:#a7f7b8;
margin-top:160px;
margin-left:160px;
height:111px;
width:680px;
border:0px solid #F00;
position:absolute;
z-index:14;
}			   
			   
			   /*************************** FINAL DO BANNER TOPO 2  *******************************/
			   
			   /***************************  BANNER EMPRESAS *******************************/

#banner_empresas{ width:127px;
height:146px;
position: absolute;
z-index:15;
background:#CCC;
border:0px solid #F00;
margin-top:450px;
display: inline;
padding-left:10px;
}

#banner_empresas ul li{ display: inline;
}

#banner_empresas ul li a{
width:133px;
height:145px;
border:0px solid #F00;
position:absolute;
margin-left:-49px;}


			   /***************************FINAL  BANNER EMPRESAS *******************************/

				/***************************  BANNER ESCOLAS *******************************/
#banner_escolas{ width:127px;
height:146px;
position: absolute;
z-index:16;
background:#CCC;
border:0px solid #F00;
margin-top:615px;
display: inline;
padding-left:10px;

}

#banner_escolas ul li{ display: inline;
}

#banner_escolas ul li a{
width:133px;
height:145px;
border:0px solid #F00;
position:absolute;
margin-left:-49px;}

			  /*************************** FINAL BANNER ESCOLAS *******************************/
			  
			  /*************************** AREA DO CONTEUDO *******************************/
#conteudo{ width:800px;
height:700px;
position: absolute;
z-index:17;
margin-top:280px;
margin-left:150px;
border:0px solid #F00;
float:none;}
			/***************************FINAL DA AREA DO CONTEUDO *************************/
			
			/***************************PRODUTO 1 *************************/

#produto_1{ width:425px;
height:240px;
background-image: inherit; background: url(../jpg/camiseta.jpg) no-repeat;
position:absolute;
z-index:18;
}

#produto_1 ul li{
	display: inline;
}

#produto_1 ul li a{
	border:0px solid #F00;
	display: block;
	height:250px;
	width:400px;
	margin-left:-30px;

}
 

#produto_1 ul li a:hover{
	background:#D8D8B1;
	filter:alpha(opacity=40);
-moz-opacity:.40;
opacity:.40;



}
			  /***************************FINAL DA AREA DO PRODUTO 1 *************************/
			  
			 /***************************PRODUTO 2 *************************/

#produto_2{ width:425px;
height:240px;
background-image: inherit; background: url(../jpg/caneca.jpg) no-repeat;
position:absolute;
z-index:19;
float:left;
border:0px solid #F00;
margin-left:415px;
margin-top:45px;

}

#produto_2 ul li{
	display: inline;
}

#produto_2 ul li a{
	border:0px solid #F00;
	display: block;
	height:219px;
	width:391px;
	margin-left:-30px;

}
 

#produto_2 ul li a:hover{
	background:#D8D8B1;
	filter:alpha(opacity=40);
-moz-opacity:.40;
opacity:.40;



}
			  /***************************FINAL DA AREA DO PRODUTO 2 *************************/ 
			  
			  /***************************PRODUTO 3 *************************/

#produto_3{ width:354px;
height:207px;
background-image: inherit; background: url(../jpg/avental.jpg) no-repeat;
position:absolute;
z-index:20;
float:left;
border:0px solid #F00;
margin-left:60px;
margin-top:300px;

}

#produto_3 ul li{
	display: inline;
}

#produto_3 ul li a{
	border:0px solid #F00;
	display: block;
	height:219px;
	width:340px;
	margin-left:-30px;

}
 

#produto_3 ul li a:hover{
	background:#D8D8B1;
	filter:alpha(opacity=40);
-moz-opacity:.40;
opacity:.40;



}
			  /***************************FINAL DA AREA DO PRODUTO 3 *************************/ 
			  
			  /***************************PRODUTO 4 *************************/

#produto_4{ width:393px;
height:187px;
background-image: inherit; background: url(../jpg/quebra-cabe%C3%A7a.jpg) no-repeat;
position:absolute;
z-index:21;
float:left;
border:0px solid #F00;
margin-left:400px;
margin-top:350px;

}

#produto_4 ul li{
	display: inline;
}

#produto_4 ul li a{
	border:0px solid #F00;
	display: block;
	height:180px;
	width:391px;
	margin-left:-30px;

}
 

#produto_4 ul li a:hover{
	background:#D8D8B1;
	filter:alpha(opacity=40);
-moz-opacity:.40;
opacity:.40;



}
			  /***************************FINAL DA AREA DO PRODUTO 4 *************************/ 
			  
			  /***************************PRODUTO 5 *************************/

#produto_5{ width:354px;
height:207px;
background-image: inherit; background: url(../jpg/mouse%20pad.jpg) no-repeat;
position:absolute;
z-index:22;
float:left;
border:0px solid #F00;
margin-left:50px;
margin-top:550px;

}

#produto_5 ul li{
	display: inline;
}

#produto_5 ul li a{
	border:0px solid #F00;
	display: block;
	height:219px;
	width:360px;
	margin-left:-30px;

}
 

#produto_5 ul li a:hover{
	background:#D8D8B1;
	filter:alpha(opacity=40);
-moz-opacity:.40;
opacity:.40;



}
			  /***************************FINAL DA AREA DO PRODUTO 5 *************************/ 
			  
			  /***************************PRODUTO 6 *************************/

#produto_6{ width:379px;
height:165px;
background-image: inherit; background: url(../jpg/babador.jpg) no-repeat;
position:absolute;
z-index:23;
float:left;
border:0px solid #F00;
margin-left:440px;
margin-top:580px;

}

#produto_6 ul li{
	display: inline;
}

#produto_6 ul li a{
	border:0px solid #F00;
	display: block;
	height:190px;
	width:360px;
	margin-left:-30px;

}
 

#produto_6 ul li a:hover{
	background:#D8D8B1;
	filter:alpha(opacity=40);
-moz-opacity:.40;
opacity:.40;



}
			  /***************************FINAL DA AREA DO PRODUTO 5 *************************/ 

/********************************************************************************
************************/
/********************************************************************************
************************/
/********************** AGORA SÓ EDITA OS CONTEUDOS DA DIV CONTEUDO DAS NOVAS PAGINAS *******************/
/********************************************************************************
************************/
/********************************************************************************
************************/



				   /******************************************************************/
				  /*************************** QUEM SOMOS *****************************/
				   /******************************************************************/
#titulo_texto{ font-family:"Normal + Trebuchet MS" ,Verdana, Geneva, sans-serif;
font-size:28px;
position:absolute;
z-index:24;
padding-left:120px;
border-bottom:3px solid #8a7854;
margin-left:20px;
margin-top:40px;
color:#8a7854;}


#texto{font-family:"Normal + Trebuchet MS" ,Verdana, Geneva, sans-serif;
font-size:18px;
text-align:justify;
position:absolute;
z-index:25;
margin-top:150px;
margin-left:100px;
color:#8a7854;}

				  /******************************************************************/
				  /*************************** CADASTRO *****************************/
				   /******************************************************************/
				   
#titulo_cadastro{ font-family:"Normal + Trebuchet MS" ,Verdana, Geneva, sans-serif;
font-size:28px;
position:absolute;
z-index:26;
padding-left:120px;
border-bottom:3px solid #8a7854;
margin-left:20px;
margin-top:40px;
color:#8a7854;}

#foumulario_cadastro{
	margin-top:100px;
	margin-left:80px;
	position:absolute;
	z-index:27;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size:15px;
	color:#8a7854;
	float:left;
	border:0px solid #8a7854;
	
}
				   
				  /******************************************************************/
				  /*************************** ENTREGA *****************************/
				  /******************************************************************/


#titulo_entrega{font-family:"Normal + Trebuchet MS" ,Verdana, Geneva, sans-serif;
font-size:28px;
position:absolute;
z-index:28;
padding-left:120px;
border-bottom:3px solid #8a7854;
margin-left:20px;
margin-top:40px;
color:#8a7854;}


				  /******************************************************************/
				 /***************************FALE CONOSCO *****************************/
				  /******************************************************************/

#titulo_fale_conosco{font-family:"Normal + Trebuchet MS" ,Verdana, Geneva, sans-serif;
font-size:29px;
position:absolute;
z-index:28;
padding-left:100px;
border-bottom:3px solid #8a7854;
margin-left:20px;
margin-top:40px;
color:#8a7854;}

#form_fale_conosco{ margin-top:130px;
	margin-left:120px;
	position:absolute;
	z-index:30;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size:15px;
	color:#8a7854;
	float:left;
	border:0px solid #8a7854;
	}
	
				  /******************************************************************/
				 /*************************** ORÇAMENTO *****************************/
				  /******************************************************************/
				  
#titulo_orcamento{font-family:"Normal + Trebuchet MS" ,Verdana, Geneva, sans-serif;
font-size:29px;
position:absolute;
z-index:28;
padding-left:100px;
border-bottom:3px solid #8a7854;
margin-left:20px;
margin-top:40px;
color:#8a7854;}				  

				  
				  /******************************************************************/
			   /***************************MENU PRODUTOS CAMISETAS *****************************/
				  /******************************************************************/
				  
				  
#titulo_camisetas{font-family:"Normal + Trebuchet MS" ,Verdana, Geneva, sans-serif;
font-size:29px;
position:absolute;
z-index:28;
padding-left:100px;
border-bottom:3px solid #8a7854;
margin-left:20px;
margin-top:40px;
color:#8a7854;}	

#foto_camiseta1_ampliada{ width:250px;
height:250px;
background-image:inherit; background: url(../jpg/fotos%20menu%20lateral/camisetas/camisa%20grande2.jpg) no-repeat;
position:absolute;
z-index:30;
margin-top:100px;
margin-left:240px;}
					  /******************************************************************/
			   /***************************GALERIA DE IMAGENS CAMISETAS *****************************/
				  /******************************************************************/
				  
				  
				  
				  /******************************************************************/
			   /**************************************ESCOLHA SUB MENU 1*****************************/
				  /******************************************************************/
#foto_escolha1{width:100px;
height:100px;
background-image:inherit; background: url(../jpg/fotos%20menu%20lateral/camisetas/camisa%20pequena2.jpg) no-repeat;
position:absolute;
z-index:31;
margin-top:450px;
margin-left:100px;}

#foto_escolha1 ul li{
display:inline;}

#foto_escolha1 ul li a{display: block;
	height:100px;
	width:100px;
	border:0px solid #F00;
	margin-left:-40px;}
	
#foto_escolha1 ul li a:hover{ background: #063;
filter:alpha(opacity=15);
-moz-opacity:.15;
opacity:.15;
}	

					/******************************************************************/
			   /**************************************ESCOLHA SUB MENU 2*****************************/
				  /******************************************************************/
				  
#foto_escolha2{width:100px;
height:100px;
background-image:inherit; background: url(../jpg/fotos%20menu%20lateral/camisetas/camisa%20pequena1.jpg) no-repeat;
position:absolute;
z-index:32;
margin-top:450px;
margin-left:250px;}

#foto_escolha2 ul li{
display:inline;}

#foto_escolha2 ul li a{display: block;
	height:100px;
	width:100px;
	border:0px solid #F00;
	margin-left:-40px;}
	
#foto_escolha2 ul li a:hover{ background: #063;
filter:alpha(opacity=15);
-moz-opacity:.15;
opacity:.15;
}					  



				   /******************************************************************/
			   /**************************************ESCOLHA SUB MENU 3*****************************/
				  /******************************************************************/


#foto_escolha3{width:100px;
height:100px;
background-image:inherit; background: url(../jpg/fotos%20menu%20lateral/camisetas/camisa%20pequena3.jpg) no-repeat;
position:absolute;
z-index:32;
margin-top:450px;
margin-left:400px;}

#foto_escolha3 ul li{
display:inline;}

#foto_escolha3 ul li a{display: block;
	height:100px;
	width:100px;
	border:0px solid #F00;
	margin-left:-40px;}
	
#foto_escolha3 ul li a:hover{ background: #063;
filter:alpha(opacity=15);
-moz-opacity:.15;
opacity:.15;
}				


				   /******************************************************************/
			   /**************************************ESCOLHA SUB MENU 4*****************************/
				  /******************************************************************/
				  
#foto_escolha4{width:100px;
height:100px;
background-image:inherit; background: url(../jpg/fotos%20menu%20lateral/camisetas/camisa%20pequena4.jpg) no-repeat;
position:absolute;
z-index:33;
margin-top:450px;
margin-left:540px;}

#foto_escolha4 ul li{
display:inline;}

#foto_escolha4 ul li a{display: block;
	height:100px;
	width:100px;
	border:0px solid #F00;
	margin-left:-40px;}
	
#foto_escolha4 ul li a:hover{ background: #063;
filter:alpha(opacity=15);
-moz-opacity:.15;
opacity:.15;
}

Thiago Retondar · Maio 7, 2009

Tente definir uma altura e largura.

Poderia hospedar?

Giovani · Maio 7, 2009

Você deve postar um link, com o site no ar.

Vou fugir um pouco da dúvida, por que fiquei curioso, este código ai embaixo é para um menu?

Pergunto isso por que o código está bem poluído. Não entendi o motivo de uma div para cada <ul><li></li></ul>

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

<div id="titulo_menu_produtos">CATEGORIAS</div><!-- menu produto 1 -->

<div id="menu_produto_1">

<ul>
<li><a href="?pg=menu camisetas">CAMISETAS</a></li>
</ul>
</div><!-- menu produto 1 -->

<div id="menu_produto_2">
<ul>
<li><a href="?pg=menu canecas">CANECAS</a></li>
</ul>
</div><!-- menu produto 2 -->

<div id="menu_produto_3">
<ul>
<li><a href="?pg=menu babadores">BABADORES</a></li>
</ul>
</div><!-- menu produto 3 -->

<div id="menu_produto_4">
<ul>
<li><a href="?pg=menu mouse pads">MOUSE PADS</a></li>
</ul>
</div><!-- menu produto 4 -->

<div id="menu_produto_5">
<ul>
<li><a href="?pg=menu quebra cabecas">QUEBRA CABEÇAS</a></li>
</ul>
</div><!-- menu produto 5 -->


<div id="menu_produto_7">
<ul>
<li><a href="?pg=aventais">AVENTAIS</a></li>
</ul>
</div><!-- menu produto 7 -->

<div id="menu_produto_8">
<ul>
<li><a href="?pg=estampas">ESTAMPAS</a></li>
</ul>
</div><!-- menu produto 8 -->

William Bruno · Maio 8, 2009

Acontece oque você cita, por ser um link, e por causa da tralha..

<div id="foto_escolha1">
<ul>
<li><a href="#" onclick="return false;"></a></li>
</ul>
</div><!-- foto escolha1 -->

Ou usa algum outro elemento, e estiliza ele como se fosse link... cursor: pointer, e tal..

já que você não tá usando o a como a mesmo...

kreator · Maio 8, 2009

opa giovani beleza!!na verdade estou corregindo o q meu parcero de trampo fez aqui!!

ele poderia montar em uma div só todo o menu + ele n sabia usar <span> para sofsticar cada botão e espaçar 2 botoes pois ficava um background só sem divisão de um botão para outro+ enfim entendi o que você quis e dizer!!!!

william beleza

vou tentar sua opção no href!!

><a href="#" onclick="return false;"></a>

até agora agradeço a força de vcs!! http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

kreator · Maio 8, 2009

william eh +- isso que quero + tem que ir para outra pagina esse

<a href="#" onclick="return false;"></a>

você clica mais permanece na mesma pagina e não vai para outra pagina que destina o link!!!

+ ele fica no lugar onde quero no layout,alguma sugestão???

William Bruno · Maio 8, 2009

Como assim ir para outra página ?

O link já está inutilizado por causa da tralha.. tem algum Javascript por trás desse processo ?

Explica melhor.. como é carregada essa outra página?

é esse sistema de includes aqui?

<li><a href="?pg=menu camisetas">CAMISETAS</a></li>

?

Se vai dar reload em toda a viewport, para carregar novamente na mesma posição, você teria que usar âncoras.. do tipo:

?pg=menu camisetas#idElemento

kreator · Maio 8, 2009

Como assim ir para outra página ?

O link já está inutilizado por causa da tralha.. tem algum Javascript por trás desse processo ?

Explica melhor.. como é carregada essa outra página?

é esse sistema de includes aqui?
<li><a href="?pg=menu camisetas">CAMISETAS</a></li>
?
Se vai dar reload em toda a viewport, para carregar novamente na mesma posição, você teria que usar âncoras.. do tipo:

?pg=menu camisetas#idElemento

ela eh carregada dessa forma

<?
$pg = 'home';
if( isset($_GET['pg']) )
$pg = $_GET['pg'];

	switch( $pg ){
	
	case 'home':
	include "home.php";
	break;
	
	case 'quem somos':
	include "quem_somos.php";
	break;
	
	case 'cadastro':
	include "cadastro.php";
	break;
	
	case 'entrega':
	include "entrega.php";
	break;
	
	case 'fale conosco':
	include "fale_conosco.php";
	break;
	
	case 'orcamento':
	include "orcamento.php";
	break;
	
	
	case 'menu camisetas':
	include "camisetas.php";
	break;
	
	case 'menu camisetas2':
	include "camisetas2.php";
	break;
	
	case 'menu camisetas3':
	include "camisetas3.php";
	break;
	
	case 'menu camisetas4':
	include "camisetas4.php";
	break;
	
	case 'veja mais':
	include "vejamais_paginas.php";
	break;
	
	case 'menu canecas':
	include "canecas.php";
	break;
	
	case 'menu babadores':
	include "babadores.php";
	break;
	
	case 'menu mouse pads':
	include "mouse_pads.php";
	break;
	
	case 'menu quebra cabecas':
	include "quebra_cabecas.php";
	break;
	
	case 'aventais':
	include "aventais.php";
	break;
	
	case 'estampas':
	include "estampas.php";
	break;
	
	
	
	default:
	include ("home.php");
	break;
	
}
?>

isso que você citou (Se vai dar reload em toda a viewport, para carregar novamente na mesma posição, você teria que usar âncoras.. do tipo:

?pg=menu camisetas#idElemento

)

eh exatamente o q quero!!!

como funciona esse procedimento???poderia dar uma luz!! http://forum.imasters.com.br/public/style_emoticons/default/joia.gif

William Bruno · Maio 8, 2009

Dá uma olhada:

http://www.htmlstaff.org/ver.php?id=1297

A idéia é a mesma.. na hora que você for fazer o include, vai ter o seguinte:

case 'home':
	include "home.php";
	break;

isso, supondo que o trecho do layout que você quer que apareça.. tenha o seguinte:

<div id="idDoElemento">.....

a âncora levará o foco da barra de rolagem até esse elemento.

http://desenaviegas.com/links.html

kreator · Maio 8, 2009

pode crer william vo fazer uns teste aqui e já posto http://forum.imasters.com.br/public/style_emoticons/default/joia.gif

nem seria uns teste + sim uns estudos kkkkkkk!!!vlw

kreator · Maio 8, 2009

william eu fiz e ficou assim!!

case 'menu camisetas2':
	include "camisetas2.php#foto_camiseta1_ampliada2";
	break;

a cima do o local da pagina e o id de qual parte do layout ira acionar

e no html assim

<div id="foto_camiseta1_ampliada2"></div><!-- foto camiseta1 ampliada -->

acima o id que quero acionar

isso está correto??? pois dá os seguintes erros:

Warning: include(camisetas2.php#foto_camiseta1_ampliada2) [function.include]: failed to open stream: No such file or directory in C:\wamp\www\site_jorge\paginas.php on line 38

Warning: include() [function.include]: Failed opening 'camisetas2.php#foto_camiseta1_ampliada2' for inclusion (include_path='.;C:\php5\pear') in C:\wamp\www\site_jorge\paginas.php on line 38

William Bruno · Maio 8, 2009

Ah tá.. erro meu.. desculpe..

faça assim:

<li><a href="?pg=menu camisetas#idElemento">CAMISETAS</a></li>
?
Se vai dar reload em toda a viewport, para carregar novamente na mesma posição, você teria que usar âncoras.. do tipo:

?pg=menu camisetas#idElemento

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Na chamada do link.. pois isso vai ser processado pelo browser.. e não no include..

desculpe.

Arquivado

[Resolvido] Sempre clico no link e vai para o topo ¬¬

Recommended Posts

kreator 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Thiago Retondar 18

Compartilhar este post

Link para o post

Compartilhar em outros sites

kreator 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

kreator 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

GabrielFerrari 41

Compartilhar este post

Link para o post

Compartilhar em outros sites

kreator 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Thiago Retondar 18

Compartilhar este post

Link para o post

Compartilhar em outros sites

kreator 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

kreator 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

Thiago Retondar 18

Compartilhar este post

Link para o post

Compartilhar em outros sites

Giovani 104

Compartilhar este post

Link para o post

Compartilhar em outros sites

William Bruno 1501

Compartilhar este post

Link para o post

Compartilhar em outros sites

kreator 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

kreator 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

William Bruno 1501

Compartilhar este post

Link para o post

Compartilhar em outros sites

kreator 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

William Bruno 1501

Compartilhar este post

Link para o post

Compartilhar em outros sites

kreator 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

kreator 0

Compartilhar este post

Link para o post

Compartilhar em outros sites

William Bruno 1501