Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

tektraum

Erro imagem em menu (bug em navegadores tambem)

Por , em Desenvolvimento frontend

Recommended Posts

tektraum    0

tektraum
Postado

Boa Tarde pessoal,

 

Não sou de ficar pedindo ajuda, tento resolver sozinho, mas desta vez não sei o que fazer ou como fazer.

 

Uso o Joomla, e peguei um template, só que quando ativei ele, o menu não apareceu as imagens, ou pelo menos elas não estavam onde deveriam... o site para quem quiser ver é:

 

www.newwavebartenders.com.br Vocês verão o que só aparece a 1 imagem e mesmo assim parece que tem uma mascara nela.

 

e uma vez consegui fazer aparecer no mozilla, mas no chrome não...

 

vou passar o arquivo que estou mexendo.

 

o template que peguei foi o yoo_pace

 

Se alguem tiver uma luz... agradeço.

 

Obrigado...

 

menu.css

/* Copyright (C) YOOtheme GmbH, YOOtheme Proprietary Use License (http://www.yootheme.com/license) */@import url(../warp/css/menus.css);/* Mega Drop-Down Menu----------------------------------------------------------------------------------------------------*/.menu-dropdown, .menu-dropdown .level1,.menu-dropdown .level1 > span { float: none; }/* Level 1 espaço entre os quadrados*/.menu-dropdown li.level1 { margin-bottom: 5px; }.menu-dropdown a.level1,      /* tamanho da letra */.menu-dropdown span.level1 {  font-size: 14px;  color: #666;  text-shadow: 0 1px 0 rgba(255,255,255,0.7);}.menu-dropdown a.level1 > span,     /* tamanho do quadrado */.menu-dropdown span.level1 > span {  display: table-cell;  width: 70px;  height: 95px;  vertical-align: middle;  text-align: center;  line-height: 1px ;}/* Set Active + Hover */.menu-dropdown li.active .level1,.menu-dropdown li.level1:hover .level1,.menu-dropdown li.remain .level1 {   position: relative;  z-index: 101; /* borda da caixinha da pra deixa redonda */  border-radius: 3px 0 0 3px;  box-shadow: 0 -1px 1px rgba(0,0,0,0.2) inset;  color: #fff;  text-shadow: 0 -1px 0 rgba(0,0,0,0.15);}.menu-dropdown li.active .level1:after,.menu-dropdown li.level1:hover .level1:after, /* setinha */.menu-dropdown li.remain .level1:after {  content: "";  display: block;  position: absolute;  top: 50%;  right: -6px;  width: 7px;  height: 14px;  margin-top: -4px;  background-position: 0 50%;  background-repeat: no-repeat;}/* Drop-Down */.menu-dropdown .dropdown {   top: -5px;  left: 100%;  -webkit-backface-visibility: hidden;}.menu-dropdown .dropdown-bg > div {  margin: 5px 5px 5px 0;  padding: 15px 20px;  background: #fff;  background: rgba(255,255,255,0.96);  border-radius: 0 3px 3px 0;  box-shadow: 1px 1px 4px rgba(0,0,0,0.1);}/* Level 2 */.menu-dropdown li.level2 { margin: 0 5px; }.menu-dropdown a.level2,.menu-dropdown span.level2 { color: #666; }/* Level 3 */.menu-dropdown a.level3 {  padding-left: 15px;  background-position: 0 0;  background-repeat: no-repeat;  color: #666;}.menu-dropdown a.level3:hover, .menu-dropdown a.level3.current { background-position: 0 -100px; }/* Icons */.menu-dropdown .level1 .level1 span.icon {  width: 40px;  height: 40px;  margin-left: 10px;  margin-bottom: 10px;  background-position: 20% 50px;  float: none;}.menu-dropdown .level1:hover .level1 span.icon ,.menu-dropdown .level1.active .level1 span.icon { background-position: 10% -20px; }  ,.menu-dropdown .level1.remain .level1 span.icon { background-position: 10% -20px; }.menu-dropdown .level1 .level1 span.icon + span { background-position: 10% -20px; }    ,.menu-dropdown .level1 .level1 span.icon + span + span { margin-left: 10px; }/* Subtitles */.menu-dropdown span.subtitle { font-size: 10px; }/* Sidebar/Accordion Menu----------------------------------------------------------------------------------------------------*//* Link */.menu-sidebar a,.menu-sidebar li > span { color: #666; }/* Level 1 */.menu-sidebar li.level1 { padding-top: 5px; }.menu-sidebar li.level1 > a,.menu-sidebar li.level1 > span {  background: #e3e3e3;  background: rgba(0,0,0,0.04);  border-radius: 3px;  box-shadow: 0 1px 0 rgba(0,0,0,0.2);}.menu-sidebar a.level1 > span, .menu-sidebar span.level1 > span { padding: 5px 100px; }/* Parent */.menu-sidebar li.parent .level1 > span {  padding-right: 20px;  background: url(../images/menu_sidebar_parent.png) 100% 0 no-repeat;}/* Hover */.menu-sidebar li.level1:hover .level1 {  background: #ddd;  background: rgba(0,0,0,0.08);  box-shadow: 0 1px 0 rgba(0,0,0,0.04),        0 0 2px rgba(0,0,0,0.05) inset,        0 1px 0 rgba(0,0,0,0.1) inset;  color: #666;  text-shadow: 0 1px 0 #fff;}.menu-sidebar li.parent:hover .level1 > span { background-position: 100% -100px; }/* Active */.menu-sidebar li.level1 .level1.active {   position: relative;  box-shadow: 0 -1px 1px rgba(0,0,0,0.2) inset;  color: #fff;  text-shadow: 0 1px 1px rgba(0,0,0,0.15);}/* Parent Active */.menu-sidebar li.parent .level1.active:before {     content: "";  display: block;  position: absolute;  bottom: -6px;  left: 15px;  width: 13px;  height: 8px;  background-position: 0 0;  background-repeat: no-repeat;}.menu-sidebar li.parent .level1.active > span { background: none; }/* Level 2-4 */.menu-sidebar ul.level2 { padding: 10px 15px 5px 15px; }.menu-sidebar .level2 a > span {   padding-left: 17px;  background-position: 0 0;  background-repeat: no-repeat;  line-height: 18px;}.menu-sidebar .level2 a:hover > span,.menu-sidebar .level2 a.current > span { background-position: 0 -100px; }.menu-sidebar ul.level2 ul { padding-left: 12px; }/* Line Menu----------------------------------------------------------------------------------------------------*/.menu-line li {  margin-left: 7px;  padding-left: 8px;  background: url(../images/menu_line_item.png) 0 50% no-repeat;}.menu-line li:first-child {  margin-left: 0;  padding-left: 0;  background: none;}

 

eita nada ainda :/

Compartilhar este post

Link para o post
Compartilhar em outros sites

Henrique Werlang    8

Henrique Werlang
Postado

Testa ae

/* Copyright © YOOtheme GmbH, YOOtheme Proprietary Use License (http://www.yootheme.com/license) */



@import url(../warp/css/menus.css);





/* Mega Drop-Down Menu

----------------------------------------------------------------------------------------------------*/



.menu-dropdown,

.menu-dropdown .level1,

.menu-dropdown .level1 > span { float: none; }



/* Level 1 espa�o entre os quadrados*/

.menu-dropdown li.level1 { margin-bottom: 5px; }



.menu-dropdown a.level1,
      /* tamanho da letra */
.menu-dropdown span.level1 {

  font-size: 14px;

  color: #666;

  text-shadow: 0 1px 0 rgba(255,255,255,0.7);

}



.menu-dropdown a.level1 > span,
    /* tamanho do quadrado */
.menu-dropdown span.level1 > span {

  display: table-cell;

  width: 70px;

  height: 95px;

  vertical-align: middle;

  text-align: center;

  line-height: 1px ;

}



/* Set Active + Hover */

.menu-dropdown li.active .level1,

.menu-dropdown li.level1:hover .level1,

.menu-dropdown li.remain .level1 {

  position: relative;

  z-index: 101;
 /* borda da caixinha da pra deixa redonda */
  border-radius: 3px 0 0 3px;

  box-shadow: 0 -1px 1px rgba(0,0,0,0.2) inset;

  color: #fff;

  text-shadow: 0 -1px 0 rgba(0,0,0,0.15);

}



.menu-dropdown li.active .level1:after,

.menu-dropdown li.level1:hover .level1:after,
 /* setinha */
.menu-dropdown li.remain .level1:after {

  content: "";

  display: block;

  position: absolute;

  top: 50%;

  right: -6px;

  width: 7px;

  height: 14px;

  margin-top: -4px;

  background-position: 0 50%;

  background-repeat: no-repeat;

}



/* Drop-Down */

.menu-dropdown .dropdown {

  top: -5px;

  left: 100%;

  -webkit-backface-visibility: hidden;

}



.menu-dropdown .dropdown-bg > div {

  margin: 5px 5px 5px 0;

  padding: 15px 20px;

  background: #fff;

  background: rgba(255,255,255,0.96);

  border-radius: 0 3px 3px 0;

  box-shadow: 1px 1px 4px rgba(0,0,0,0.1);

}



/* Level 2 */

.menu-dropdown li.level2 { margin: 0 5px; }



.menu-dropdown a.level2,

.menu-dropdown span.level2 { color: #666; }



/* Level 3 */

.menu-dropdown a.level3 {

  padding-left: 15px;

  background-position: 0 0;

  background-repeat: no-repeat;

  color: #666;

}



.menu-dropdown a.level3:hover,

.menu-dropdown a.level3.current { background-position: 0 -100px; }



/* Icons */

.menu-dropdown .level1 .level1 span.icon {

  width: 62px;

  height: 50px;

  margin-left: 10px;

  margin-bottom: 10px;


  float: none;

  margin-top: 0px;

}

.menu-dropdown .level1:hover .level1 span.icon ,

.menu-dropdown .level1.active .level1 span.icon { background-position: 0px -0px; }  ,

.menu-dropdown .level1.remain .level1 span.icon { background-position: 10% -20px; }



.menu-dropdown .level1 .level1 span.icon + span { background-position: 10% -20px; }    ,

.menu-dropdown .level1 .level1 span.icon + span + span { margin-left: 10px; }



/* Subtitles */

.menu-dropdown span.subtitle { font-size: 10px; }





/* Sidebar/Accordion Menu

----------------------------------------------------------------------------------------------------*/



/* Link */

.menu-sidebar a,

.menu-sidebar li > span { color: #666; }





/* Level 1 */

.menu-sidebar li.level1 { padding-top: 5px; }



.menu-sidebar li.level1 > a,

.menu-sidebar li.level1 > span {

  background: #e3e3e3;

  background: rgba(0,0,0,0.04);

  border-radius: 3px;

  box-shadow: 0 1px 0 rgba(0,0,0,0.2);

}



.menu-sidebar a.level1 > span,

.menu-sidebar span.level1 > span { padding: 5px 100px; }



/* Parent */

.menu-sidebar li.parent .level1 > span {

  padding-right: 20px;

  background: url(../images/menu_sidebar_parent.png) 100% 0 no-repeat;

}



/* Hover */

.menu-sidebar li.level1:hover .level1 {

  background: #ddd;

  background: rgba(0,0,0,0.08);

  box-shadow: 0 1px 0 rgba(0,0,0,0.04),

        0 0 2px rgba(0,0,0,0.05) inset,

        0 1px 0 rgba(0,0,0,0.1) inset;

  color: #666;

  text-shadow: 0 1px 0 #fff;

}



.menu-sidebar li.parent:hover .level1 > span { background-position: 100% -100px; }



/* Active */

.menu-sidebar li.level1 .level1.active {

  position: relative;

  box-shadow: 0 -1px 1px rgba(0,0,0,0.2) inset;

  color: #fff;

  text-shadow: 0 1px 1px rgba(0,0,0,0.15);

}



/* Parent Active */

.menu-sidebar li.parent .level1.active:before {

  content: "";

  display: block;

  position: absolute;

  bottom: -6px;

  left: 15px;

  width: 13px;

  height: 8px;

  background-position: 0 0;

  background-repeat: no-repeat;

}



.menu-sidebar li.parent .level1.active > span { background: none; }



/* Level 2-4 */

.menu-sidebar ul.level2 { padding: 10px 15px 5px 15px; }



.menu-sidebar .level2 a > span {

  padding-left: 17px;

  background-position: 0 0;

  background-repeat: no-repeat;

  line-height: 18px;

}



.menu-sidebar .level2 a:hover > span,

.menu-sidebar .level2 a.current > span { background-position: 0 -100px; }



.menu-sidebar ul.level2 ul { padding-left: 12px; }





/* Line Menu

----------------------------------------------------------------------------------------------------*/



.menu-line li {

  margin-left: 7px;

  padding-left: 8px;

  background: url(../images/menu_line_item.png) 0 50% no-repeat;

}



.menu-line li:first-child {

  margin-left: 0;

  padding-left: 0;

  background: none;

}

 

Quando for assim, use o inspecionar elemento do chrome ou firefox, fica mais fácil de resolver...

Compartilhar este post

Link para o post
Compartilhar em outros sites

tektraum    0

tektraum
Postado

Boa Tarde,

 

Muito obrigado pela resposta Henrique Werlang, o codigo que você me passou "não funcionou", mas a dica que você forneceu está ajudando.

 

Nunca pensei em usar esse inspecionar elemento dos navegadores, e seu codigo "não funcionou" , porque tem varias outras paginas a modificar..., e pelo inspecionar estou vendo quais tenho que mudar.. e aos poucos acho que vou conseguindo, no mozilla já está aparecendo quase certinho, só falta no chrome, por emquanto o topico está quase que resolvido rs.

 

vlw pela ajuda, abraços

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito