Aprende Java Aprende Php Aprende C++ Aprende HTML 5 Aprende JavaScript Aprende JSON Aprende MySQL Aprende SQLServer Aprende Visual Basic 6 Aprende PostgreSQL Aprende SQLite Aprende Redis Aprende Kotlin Aprende XML Aprende Linux VSC Aprende Wordpress Aprende Laravel Aprende VueJS Aprende JQuery Aprende Bootstrap Aprende Netbeans Aprende Android
Sigueme en Facebook Sigueme en Twitter Sigueme en Instagram Sigueme en Youtube Sigueme en TikTok Sigueme en Whatsapp
Home / Desarrollo Web / Ajustar imagen de fondo a diferentes resoluciones

Ajustar imagen de fondo a diferentes resoluciones

Por jc mouse domingo, mayo 19, 2013

easy resize

Si diseñamos paginas web, nos habremos topado con el problema de colocar una imagen de fondo y que este se adapte a toda la variedad de resoluciones de pantalla que existe, se puede lograr esto utilizando CSS pero existe un plugin en javascript que nos facilita mucho este trabajo.

El plugin se llama jQuery Easy Background Resize y su manera de utilizarlo es realmente sencillo.

<head>
    <title>Template 1</title>
      <link rel="stylesheet" href="style.css?b171" />        

      <script src="js/jquery-1.8.2.js" type="text/javascript" charset="utf-8"></script>
      <script src="js/jquery.ez-bg-resize.js" type="text/javascript" charset="utf-8"></script>
      <script>
          $(document).ready(function() {
            $("body").ezBgResize({
                img : "images/bg.png"
            });
        });
      </script>
</head>

Pagina Web Oficial

Ejemplo

Proyecto en GitHub

Tags

Artículos similares

Introducción al Diseño Web Adaptable (Responsivo)

El diseño web adaptable (Responsive Web Design) va evolucionando como una filosofía de diseño y desarrollo de paginas we[...]

Cargar fuente TTF

Cuando realizamos un proyecto java utilizando fuentes de nuestro sistema, al momento de distribuir el programa y ejecuta[...]

Convertir imagen a Base64

En este post vemos un ejemplo de como convertir un archivo de imagen en una cadena de texto codificado en Base64 aprovec[...]

Criba de Eratóstenes animado

Eratóstenes era un matemático griego del siglo  III a.C. el cual ideó una manera rápida de obtener todos los números pri[...]

Duplicación de objetos con la Interface Cloneable

En este post aprenderemos lo que es la clonación de objetos en java o lo que es lo mismo, generación de nuevas instancia[...]

Cambiar icono de aplicación en IDE Eclipse

Si tenemos una aplicación android que estemos desarrollando en el IDE Eclipse y queremos cambiar el icono de la aplicaci[...]