|

GlassBox: bordes transparentes mediante Javascript y CSS

ByLuis

GlassBox es una librería Javascript que permite añadir bordes transparentes, con transparencias y con sombreado. Es muy sencillo de usar, admite skins, bien documentado y funciona en IE 6, Firefox 2, Opera 9 y Safari 3.

glassbox.png

GlassBox

Vía / CSS Globe

Similar Posts

Konstruktors: snippets CSS

ByLuis

konstruktor.pngKonstruktors es un lugar dónde podremos encontrar códigos CSS para copiar y pegar. No se trata de ficheros independientes, sino de trozos de código.
Mantener código CSS en ficheros de texto no es difícil, y es conveniente teniendo múltiples llamadas HTTP. Si tenemos bien organizados nuestros estilos, con estos trozos de código podremos modificar los estilos sin mayor dificultad.
Los trozos de código se dividen en uso para grid, aspectos básicos de HTML y menús.
Konstruktors
Vía / Posh CSS

CodePress: resalta código mediante Javascript

ByLuis

CodePress permite resaltar el código de diversos lenguajes de programación en nuestras páginas web mediante Javascript. El código se puede modificar en tiempo real y permite entre otras el autocompletado de comillas, paréntesis y parecidos, la inclusión de trozos de código (por ejemplo los paréntesis y llaves en una sentencia if) y shortcuts (por ejemplo mostrar entidades html).
codepress.png
Los lenguajes que interpreta son PHP, Javascript, Java, Perl, SQL, HTML y CSS. Y existen fallos detectados son que los números no cambian de tamaño ya que son imágenes y que el copy/paste falla en algunas ocasiones en Internet Explorer.
CodePress
Vía / OpenSourceCommunity.org

Detectar características HTML5 mediante Javascript

ByLuis

Aunque el HTML5 no está disponible en todos los navegadores, no es mala idea ir incluyendo en nuestras webs aplicaciones que hagan uso de HTML5, e ir dándole un poco de vidilla al asunto y no estar pendientes de Internet Explorer. Por ello, este script nos puede venir muy bien:

function detectBrowserCapabilities(){
  var res = new Array();
  res["userAgent"] = navigator.userAgent;    
  var hasWebWorkers = !!window.Worker;
  res["workersFlag"] = "" + hasWebWorkers;
  var hasGeolocation = !!navigator.geolocation;
  res["geoFlag"] = "" + hasGeolocation;
  if (hasGeolocation) {
    document.styleSheets[0].cssRules[1].style.display = "block";
    navigator.geolocation.getCurrentPosition(function(location) {
      res["geoLat"] = location.coords.latitude;
      res["geoLong"] = location.coords.longitude;
    });
  }
  var hasDb = !!window.openDatabase;
  res["dbFlag"] = "" + hasDb;
  var videoElement = document.createElement("video");
  var hasVideo = !!videoElement["canPlayType"];
  var ogg = false;
  var h264 = false;
  if (hasVideo) {
    ogg = videoElement.canPlayType('video/ogg; codecs="theora, vorbis"') || "no";
    h264 = videoElement.canPlayType('video/mp4; 
    codecs="avc1.42E01E, mp4a.40.2"') || "no";
  }
  res["videoFlag"] = "" + hasVideo;
  if (hasVideo){
    var vStyle = document.styleSheets[0].cssRules[0].style;
    vStyle.display = "block";
  }
  res["h264Flag"] = "" + h264;
  res["oggFlag"] = "" + ogg;
  return res;
}

Build Web applications with HTML 5