Archivo | javascript RSS feed for this section

Fechas en javascript

4 Abr

Esta vez escribo sobre un problema que tuve con Javascript y… Mozilla! (Sí, no fue con Internet Explorer!).

Si bien parece ser que tanto IE como Chrome reconocen esta expresión javascript como una fecha:

fecha_fin = new Date (“mm-dd-yyyy’); (Ej. fecha_fin = new Date (“01-22-2000′))

No ocurre lo mismo con Mozilla. Entonces, si tenemos que evaluar una fecha (para por ejemplo compararla con otra), una buena forma es transformar esa fecha a un formato “mm/dd/yyyy hh:mm:ss” . Para eso, si teníamos una fecha en formato “mm-dd-yyyy”, podemos hacer algo así:

fecha = “04-22-2000”;
re = new RegExp(“-“, “g”); // Creamos expresión regular para remplazar “-” por “/”
fecha_barra = fecha.replace(re,”/”); // reemplazamos
fecha_convertida = new Date fecha_barra +” 00:00:00″);
Bastante complicadito la verdad para algo que debería ser tan sencillo! Pero bueno, haciéndolo así, funciona en todos lados :D.

Popup de agregar producto en Virtuemart – IE

26 Nov

Estaba teniendo un problema con el popup que aparece cuando se agrega un producto al carrito en Virtuemart. En Internet Explorer, el popup aparecía bien arriba en la pantalla y no se leía bien. El popup se genera con Mootools. En mi caso, el problema se solucionó activando el plug-in System – Mootools upgrade de Joomla!.

Modificar el tamaño de letra con javascript

19 Oct

Estaba tratando de agregarle a Joomla un componente para agrandar y achicar el tamaño de letra. Si bien hay varios, ninguno funcionaba correctamente. Encontré entonces un script que funciona super bien, y que funciona para cuando tenemos los tamaños de letra en px (que es lo que uso habitualmente).

El script es el siguiente:

var min=8;
var max=18;
function increaseFontSize() {

   var p = document.getElementsByTagName('p');
   for(i=0;i<p.length;i++) {

      if(p[i].style.fontSize) {
         var s = parseInt(p[i].style.fontSize.replace("px",""));
      } else {

         var s = 12;
      }
      if(s!=max) {

         s += 1;
      }
      p[i].style.fontSize = s+"px"

   }
}
function decreaseFontSize() {
   var p = document.getElementsByTagName('p');
   for(i=0;i<p.length;i++) {

      if(p[i].style.fontSize) {
         var s = parseInt(p[i].style.fontSize.replace("px",""));
      } else {

         var s = 12;
      }
      if(s!=min) {

         s -= 1;
      }
      p[i].style.fontSize = s+"px"

   }
}
Y se usa, así:
<a href="javascript:decreaseFontSize();">-</a> 
<a href="javascript:increaseFontSize();">+</a>
(Tomado de: http://www.white-hat-web-design.co.uk/blog/controlling-font-size-with-javascript/)

Pasar variable de Javascript a PHP

13 Abr

Si bien en teoría no es posible pasar variables directamente de Javascript a PHP, existe un workaround bastante interesante utilizando cookies. Por ejemplo, el siguiente código podría utilizarse para saber en PHP cuál es el ancho de pantalla que se está utilizando:

<?php
// Ancho del monitor para el popup
if(isset($_COOKIE[“ancho_monitor”]))
$screen_res = $_COOKIE[“ancho_monitor”];
else //means cookie is not found set it using Javascript
{
?>
<script language=”javascript”>
<!–
writeCookie();
function writeCookie()
{
var today = new Date();
var the_date = new Date(“December 31, 2023”);
var the_cookie_date = the_date.toGMTString();
var the_cookie = “ancho_monitor=”+ screen.width;
var the_cookie = the_cookie + “;expires=” + the_cookie_date;
document.cookie=the_cookie;
window.location = “index.php”;
}
//–>
</script>
<?php
}
$ancho_monitor = $_COOKIE[“ancho_monitor”];
// Termina ancho del monitor
?>

(Esto lo que hace es setear una cookie en el caso de que aún no esté seteada, y utiliza javascript para saber el ancho del monitor. Podría también obtenerse el alto con screen.height).

Se refresca la página en el script de javascript (en este caso index.php), porque sino la cookie no la agarra PHP.

Finalmente, podemos en el código php utilizar la variable $ancho_monitor.

Problema con JQuery y Mootools

11 Feb

Estaba teniendo algunos problemas con un componente de joomla. En un template el módulo funcionaba, pero en el mio no. Después de verlo en detalle, vi que el módulo utilizaba Mootools. Además, en mi template, otro módulo estaba utilizando JQuery. Mootools debe cargarse antes que JQuery para que no haya conflictos. Además, en la función de JQuery, hay que utilizar una función noconflict.

Lo que hice para solucionar el problema fue:

1. En la página, cargar la librería Mootools antes que la JQuery

2. Antes de utilizar my función JQuery poner:

var jq = jQuery.noConflict();

Luego, sustituir el $ en la función por jq . (En teoría, también se podría haber dejado el $ utilizando jQuery.noConflict(); , pero eso no funcionó en mi caso).

 

Idea tomada de: http://www.alltogetherasawhole.org/profiles/blogs/preventing-jquery-and-mootools

Pasar Variable desde PHP a Javascript

24 Ene

Un tema y tip interesante: cómo pasar una variable en PHP a Javascript?

En mi caso, estamos armando un sistema multi-idioma, en el que tenemos un archivo de PHP que tiene una serie de constantes que son los textos para cada idioma. Tengo un archivo por idioma.

Lo que necesitaba hacer, es que un alert en Javascript tomara como mensaje una de esas constantes en PHP.

Para esto, lo que se hace es:

1. En el HTML de la página, se crea un input hidden, con el texto o la variable PHP que queremos pasarle a Javascript:

<input type=”hidden” name=”mensajeConfirmaBorrar” id=”mensajeConfirmaBorrar” value=”<?php echo _LISTADO_DOCUMENTOS_CONFIRMA_BORRAR; ?>” />

2. Luego en el script, simplemente se llama al value del hidden:

document.getElementById(“mensajeConfirmaBorrar”).value

(Solución tomada de: http://bytes.com/topic/php/answers/827223-passing-values-php-javascript )

Marquesina con stop

3 Nov

Bueno, para un sitio de compra venta de propiedades, necesitabamos hacer un banner que fuera pasando las propiedades de abajo hacia arriba. Lo que utilizamos para eso fue una marquesina:

<marquee behavior=”scroll” direction=”up” scrolldelay=”100″ scrollamount=”2″ onMouseover=”this.scrollAmount=0″ onMouseout=”this.scrollAmount=2″ height=”300px”>

</marquee>

Lo interesante, es que además a la marquesina le agregamos código Javascript en el Mouseover y en el Mouseout, de manera de que al parar el mouse sobre la propiedad, ésta se queda quieta para que el usuario pueda leer tranquilo y si quiere visitar el link por más datos.

 

A %d blogueros les gusta esto: