Problema livello z con firefox su moduli sovrapposti.

[archiged]

Salve a tutti
spero di aver postato nella sezione più adatta, ho un problema di livelli tra due moduli un'immagine cliccabile sulla posizione top_left e un menù cliccabile su top_righ...
 
con IE tutto ok il menù è funzionante e sembra che sovrasti l'immagine di sotto sia visivamente che per i link sul menù, mentre su Firefox il menù è visibile, ma i link non sono funzionanti ... in questo caso il menù è sovrastato dall'immagine e dal link sull'immagine,,, praticamente non mi fa cliccare il menu.
 
sto cercando 2 possibili soluzioni, mettendo mani al codice...
1. cercare il valore z dell'immagine e abbassarlo... mentre sul menu sarà necessario alzarlo.
 
2. ridefinire l'area cliccabile dell'immagine a 1px x 1px inmodo che non copra il menù
 
allego il codice del modulo e un'immagine...
 
se qualcuno ha in'idea di come operare...
 
grazie in anticipo. Maurizio
 

Codice: [Seleziona]


 <?php if ($layout  == "2") { ?>
<div id="s5_nd" style="height:<?php echo $height ?>px;width:<?php echo $width ?>px;background:#000000; overflow:hidden">
 <div id="s5_nd_inner" onmouseover="s5_nd_onhover();" onmouseout="s5_nd_outhover();" style="opacity:.0; <?php if ($is_ie6 == "yes" || $is_ie7 == "yes") { ?>filter: alpha(opacity=0); -moz-opacity: 0;<?php } ?> ">
  <div style="cursor:pointer; height:<?php echo $height ?>px;width:<?php echo $width ?>px; overflow:hidden; background-image: url(<?php echo $text1_image ?>); background-repeat: no-repeat" id="blenddiv_s5_nd">
   <img src="<?php echo $text1_image ?>" style="cursor:pointer; border: 0 none;opacity:.0; <?php if ($is_ie6 == "yes" || $is_ie7 == "yes") { ?>filter: alpha(opacity=0); -moz-opacity: 0;<?php } ?> " id="blendimage_s5_nd" alt="" />
  </div>
 
 
  <div style="width:<?php echo $width ?>px;position:absolute;margin-top:-29px;z-index:1;display:none;" id="s5_nd_onhover" >
   <div style="margin-left:<?php echo (($width) - 75) - (($content_size_layout2) / 2)?>px;position:absolute;margin-top:-<?php echo (($height) / 2) + (20)?>px;">
    <div id="s5_nd_stop_2" style="margin-top:4px;cursor:pointer; float:left; margin-left:4px; margin-right:4px" onclick="s5_nd_stop();s5_nd_switchbuttons();"></div>
    <div id="s5_nd_play_2" style="display:none;margin-top:4px; cursor:pointer; float:left; margin-left:4px; margin-right:8px" onclick="s5_nd_play();s5_nd_switchbuttons();"></div>
   </div>
  </div>
 
 
  <div style="width:<?php echo $width ?>px;position:absolute;margin-top:-29px;z-index:0;">
  <div style="float:right;margin-right:10px;">
  <div id="s5_nd_buttons" style="font-size:11px; float:left; padding:3px; <?php if ($is_ie6 == "yes") { ?>padding-bottom:0px; <?php } ?>padding-left:6px; padding-right:0px;padding-top:0px;">

  <script type="text/javascript">//<![CDATA[
  if (document.getElementById("s5_nd_title_1")) {
   document.write('<div id="s5_nd_1" class="s5_nd_button" style="cursor:pointer; float:left; margin-left:3px; margin-right:3px" onclick="s5_nd_start();s5_nd_play1();s5_nd_stop()">1</div>');
   }
  if (document.getElementById("s5_nd_title_2")) {
   document.write('<div id="s5_nd_2" class="s5_nd_button" style="cursor:pointer; float:left; margin-left:3px; margin-right:3px" onclick="s5_nd_start();s5_nd_play2();s5_nd_stop()">2</div>');
   }
  if (document.getElementById("s5_nd_title_3")) {
   document.write('<div id="s5_nd_3" class="s5_nd_button" style="cursor:pointer; float:left; margin-left:3px; margin-right:3px" onclick="s5_nd_start();s5_nd_play3();s5_nd_stop()">3</div>');
   }
  if (document.getElementById("s5_nd_title_4")) {
   document.write('<div id="s5_nd_4" class="s5_nd_button" style="cursor:pointer; float:left; margin-left:3px; margin-right:3px" onclick="s5_nd_start();s5_nd_play4();s5_nd_stop()">4</div>');
   }
  if (document.getElementById("s5_nd_title_5")) {
   document.write('<div id="s5_nd_5" class="s5_nd_button" style="cursor:pointer; float:left; margin-left:3px; margin-right:3px" onclick="s5_nd_start();s5_nd_play5();s5_nd_stop()">5</div>');
   }
  if (document.getElementById("s5_nd_title_6")) {
   document.write('<div id="s5_nd_6" class="s5_nd_button" style="cursor:pointer; float:left; margin-left:3px; margin-right:3px" onclick="s5_nd_start();s5_nd_play6();s5_nd_stop()">6</div>');
   }
  if (document.getElementById("s5_nd_title_7")) {
   document.write('<div id="s5_nd_7" class="s5_nd_button" style="cursor:pointer; float:left; margin-left:3px; margin-right:3px" onclick="s5_nd_start();s5_nd_play7();s5_nd_stop()">7</div>');
   }
  if (document.getElementById("s5_nd_title_8")) {
   document.write('<div id="s5_nd_8" class="s5_nd_button" style="cursor:pointer; float:left; margin-left:3px; margin-right:3px" onclick="s5_nd_start();s5_nd_play8();s5_nd_stop()">8</div>');
   }
  if (document.getElementById("s5_nd_title_9")) {
   document.write('<div id="s5_nd_9" class="s5_nd_button" style="cursor:pointer; float:left; margin-left:3px; margin-right:3px" onclick="s5_nd_start();s5_nd_play9();s5_nd_stop()">9</div>');
   }
  if (document.getElementById("s5_nd_title_10")) {
   document.write('<div id="s5_nd_10" class="s5_nd_button" style="cursor:pointer; float:left; margin-left:3px; margin-right:3px" onclick="s5_nd_start();s5_nd_play10();s5_nd_stop()">10</div>');
   }
  //]]></script>
  </div>
  </div>
  </div>
 
 
  <div id="s5_nd_content_window_bg" style="opacity:.0; <?php if ($is_ie6 == "yes" || $is_ie7 == "yes") { ?>filter: alpha(opacity=0); -moz-opacity: 0;<?php } ?> ; width:<?php echo $content_size_layout2 ?>px; margin-top:-<?php echo $height ?>px; height:<?php echo $height ?>px; overflow:hidden; <?php if ($content_bg_color  != "none") { ?>background:#<?php echo $content_bg_color ?>; <?php } ?>position:absolute">
  </div>
 
  <div id="s5_nd_content_window" style="width:<?php echo $content_size_layout2 ?>px; margin-top:-<?php echo $height ?>px; height:<?php echo $height ?>px; overflow:hidden; position:absolute; z-index:2">
   <div id="s5_nd_content_window_inner" style="padding-left:<?php echo $content_padding_left ?>px; padding-right:<?php echo $content_padding_right ?>px; padding-top:<?php echo $content_padding_top ?>px; padding-bottom:<?php echo $content_padding_bottom ?>px">
   
   <div id="s5_nd_title" style="cursor:pointer; width:<?php echo $content_size_layout2 - ($content_padding_left + $content_padding_right) ?>px; line-height:<?php echo $content_lineheight - 50 ?>%; margin-bottom:<?php echo $title_margin ?>px; float:left; color:#<?php echo $title_color ?>; font-size:<?php echo $title_size ?>px"></div>
    <div style="clear:both"></div>
   <div id="s5_nd_text" style="width:<?php echo $content_size_layout2 - ($content_padding_left + $content_padding_right) ?>px; line-height:<?php echo $content_lineheight ?>%; float:left; color:#<?php echo $text_color ?>; font-size:<?php echo $text_size ?>px"></div>
   
   <?php if ($article_link  == "yes") { ?>
    <div style="clear:both"></div>
   <div id="s5_nd_hyperlink" style="width:<?php echo $content_size_layout2 - ($content_padding_left + $content_padding_right) ?>px; line-height:14px; float:left; color:#000000; font-size:<?php echo $text_size ?>px; margin-top:17px; cursor:pointer; font-weight:bold"></div>
   <?php } ?>
   
   </div>
  </div>
 </div>
</div>
 
<div style="clear:both"></div>
<?php } ?>



[56francesco]

scusa non ho capito quale difficoltà stai incontrando..

[archiged]

Salve,
il problema è che con firefox i menù sulla destra (vedi immagine allegata) hanno un link ma non sono cliccabili.
 
Il browser rende cliccabile l'area(invisibile) dell'immagine si sfondo sopra i miei menù ...annullando di conseguenza la possibilità di cliccarli.
 
spero di essere stato chiaro.
 
grazie Maurizio

[Murphz]

Prova a eliminare lo z-index impostato a 0, avevo avuto problemi anche io su firefox impostandolo a 0.


Usa valori positivi > 0.

[archiged]

Niente da fare con lo z-index ho fatto tutti i tentativi, il problema sorge alla riga 239

Codice: [Seleziona]

        <div style="cursor:pointer; height:<?php echo $height ?>px;width:<?php echo $width ?>px; overflow:hidden; background-image: url(<?php echo $text1_image ?>); background-repeat: no-repeat" id="blenddiv_s5_nd">

            <img src="<?php echo $text1_image ?>" alt="" name="blendimage_s5_nd" id="blendimage_s5_nd" style="cursor:pointer; border: 0 none;opacity:.0; <?php if ($is_ie6 == "yes" || $is_ie7 == "yes") { ?>filter: alpha(opacity=0); -moz-opacity: 0;<?php } ?> " />
il valore Height è ok  ma il valore width se lo modifico  es.10px "scopre" i menù rendendoli cliccabili... ma fa vedere solo 10px dell'immagine.... perciò credo che area di over e dimensione immagine sono relazionate... come faccio a "staccarle"...


humm come fare

ciao

[archiged]

Mi rispondo con un se... se andassi ad operare nel template? cioè la posizione modulo top_left la inserisco in un div e gli alzo il livello....?
 
qualcuno ha soluzioni
 
M.