Título: javascript funciona en firefox 3.6 y en IE8 no -.-
Publicado por: mark182 en 28 Junio 2010, 03:20 am
Hola como esta? encontre un script de un calendario que es perfecto para lo que estoy haciendo, el problema es el siguiente, primero les dejo la pagina con el calendario para que me sigan un poco mejor http://www.historia-virtual.com.ar (http://www.historia-virtual.com.ar). Bien paso a explicar, como pueden ver hay algunos dias que tienen eventos y cuando te paras con el mouse arriba de cada dia con evento, aparece el titulo del evento con la descripcion, esto solo sucede haci en firefox pero en IE8 solo me aparece el titulo del evento, por que es esto? que es lo que tengo que hacer? :-\ Les dejo el codigo: <?php
include("Clases/ConexionBD.php");
$conexion= new ConexionBD("mysql14.000webhost.com","regist");
//check if time is set in the URL
if(isset($_GET['time']))
$time = $_GET['time'];
else
$time = time();
$today = date("Y/n/j", time());
$current_month = date("n", $time);
$current_year = date("Y", $time);
$current_month_text = date("m", $time);
$next_month = mktime(0,0,0,$current_month+1,1,$current_year);
$next_month_text = date("m", $next_month);
$previous_month = mktime(0,0,0,$current_month-1,1,$current_year);
$previous_month_text = date("F \'y", $previous_month);
$next_year = mktime(0,0,0,$current_month,1,$current_year+1);
$next_year_text = date("F \'y", $next_year);
$previous_year = mktime(0,0,0,$current_month,1,$current_year-1);
$previous_year_text = date("F \'y", $previous_year);
switch($current_month_text)
{
case 1:
$current_month_text = "Enero";
break;
case 2:
$current_month_text = "Febrero";
break;
case 3:
$current_month_text = "Marzo";
break;
case 4:
$current_month_text = "Abril";
break;
case 5:
$current_month_text = "Mayo";
break;
case 6:
$current_month_text = "Junio";
break;
case 7:
$current_month_text = "Julio";
$next_month_text = "Julio";
break;
case 8:
$current_month_text = "Agosto";
break;
case 9:
$current_month_text = "Septiembre";
break;
case 10:
$current_month_text = "Octubre";
break;
case 11:
$current_month_text = "Noviembre";
break;
case 12:
$current_month_text = "Diciembre";
break;
}
$total_days_of_current_month = date("t", $time);
$events = array();
$result = mysql_query("SELECT DATE_FORMAT(diaEvento,'%d') AS day,contenidoEvento,tituloEvento FROM calendario WHERE diaEvento BETWEEN '$current_year/$current_month/01' AND '$current_year/$current_month/$total_days_of_current_month'");
while($row_event = mysql_fetch_object($result))
{
$events[intval($row_event->day)] .= '<li><span class="title">'.stripslashes($row_event->tituloEvento).'</span><span class="desc">'.stripslashes($row_event->contenidoEvento).'</span></li>';
}
$first_day_of_month = mktime(0,0,0,$current_month,1,$current_year);
$first_w_of_month = date("w", $first_day_of_month);
$total_rows = ceil(($total_days_of_current_month + $first_w_of_month)/7);
$day = -$first_w_of_month;
?>
<div id="calendario">
<table id="tabla-calendario" cellspacing="0">
<thead>
<tr><th id="mes" colspan="7"><?php echo $current_month_text;?> <?php echo $current_year;?></th></tr>
<tr>
<th>Dom</th>
<th>Lun</th>
<th>Mar</th>
<th>Mie</th>
<th>Jue</th>
<th>Vie</th>
<th>Sab</th>
</tr>
</thead>
<tr>
<?php
for($i=0; $i< $total_rows; $i++)
{
for($j=0; $j<7;$j++)
{
$day++;
if($day>0 && $day<=$total_days_of_current_month)
{
$date_form = "$current_year/$current_month/$day";
echo '<td';
if($date_form == $today)
{
echo ' class="today"';
}
if(array_key_exists($day,$events))
{
echo ' class="date_has_event"> '.$day;
echo '<div class="events"><ul>'.$events[$day].'</ul></div>';
}
else
{
echo '> '.$day;
}
echo "</td>";
}
else
{
echo '<td class="padding"> </td>';
}
}
echo "</tr><tr>";
}
?>
</tr>
<tfoot>
<th>
<a href="<?=$_SERVER['PHP_SELF']?>?time=<?=$previous_year?>" title="Año Anterior">««</a>
</th>
<th>
<a href="<?=$_SERVER['PHP_SELF']?>?time=<?=$previous_month?>" title="Mes Anterior">«</a>
</th>
<th> </th>
<th> </th>
<th> </th>
<th>
<a href="<?=$_SERVER['PHP_SELF']?>?time=<?=$next_month?>" title="Mes Siguiente">»</a>
</th>
<th>
<a href="<?=$_SERVER['PHP_SELF']?>?time=<?=$next_year?>" title="Año Siguiente">»»</a>
</th>
<tr><th id="ocultar" colspan="7"><a href="#">Ocultar Calendario</a></th></tr>
</tfoot>
</table>
</div>
*Aca el codigo de el script de javascript $(function () {
$('.date_has_event').each(function () {
// options
var distance = 10;
var time = 25;
var hideDelay = 500;
var hideDelayTimer = null;
// tracker
var beingShown = false;
var shown = false;
var trigger = $(this);
var popup = $('.events ul', this).css('opacity', 0);
// set the mouseover and mouseout on both element
$([trigger.get(0), popup.get(0)]).mouseover(function () {
// stops the hide event if we move from the trigger to the popup element
if (hideDelayTimer) clearTimeout(hideDelayTimer);
// don't trigger the animation again if we're being shown, or already visible
if (beingShown || shown) {
return;
} else {
beingShown = true;
// reset position of popup box
popup.css({
top: 20,
left: -76,
display: 'none',
'z-index': 1000,
position: 'absolute',
display: 'block' // brings the popup back in to view
})
// (we're using chaining on the popup) now animate it's opacity and position
.animate({
bottom: '+=' + distance + 'px',
opacity: 1
}, time, 'swing', function() {
// once the animation is complete, set the tracker variables
beingShown = false;
shown = true;
});
}
}).mouseout(function () {
// reset the timer if we get fired again - avoids double animations
if (hideDelayTimer) clearTimeout(hideDelayTimer);
// store the timer so that it can be cleared in the mouseover if required
hideDelayTimer = setTimeout(function () {
hideDelayTimer = null;
popup.animate({
bottom: '-=' + distance + 'px',
opacity: 0
}, time, 'swing', function () {
// once the animate is complete, set the tracker variables
shown = false;
// hide the popup entirely after the effect (opacity alone doesn't do the job)
popup.css('display', 'none');
});
}, hideDelay);
});
});
});
|