• Publicidad
  • Contacto
Pixelco Tech Blog
  • Noticias
  • Video
  • Tecnología
    • Audio & Video
    • LifeStyle
    • Transformación Digital
  • Ciencia
    • Ciencia Ficción
  • Fotografía
  • Internet
    • Desarrollo/programación
    • Diseño
Sin resultados
Ver todos los resultados
Pixelco Tech Blog
  • Noticias
  • Video
  • Tecnología
    • Audio & Video
    • LifeStyle
    • Transformación Digital
  • Ciencia
    • Ciencia Ficción
  • Fotografía
  • Internet
    • Desarrollo/programación
    • Diseño
Sin resultados
Ver todos los resultados
Pixelco Tech Blog
Sin resultados
Ver todos los resultados

Efecto clic tipo iPhone con Mootools o jQuery

Diego CambiasoporDiego Cambiaso
30/09/2009
enDesarrollo/programación, Diseño, Internet, Recursos
Tiempo de lectura1 minuto
0

iphone-clic-jquery-mootoolsSi te gusta el efecto que muestra el navegador Safari en un iPhone al hacer clic sobre un enlace, entonces te van gustar las siguientes dos implementaciones del mismo efecto, una con Mootools y la otra con jQuery.

Se trata del tutorial iPhone Click Effect Using MooTools or jQuery publicado en el blog David Walsh, el efecto es muy sencillo al igual que la implementación.

Implementación

Para el color que consiguen los enlaces se utiliza un código CSS como el siguiente:

EntradasRelacionados

4 Tips de Oracle para iniciarte en el mundo de la programación

Ventajas, desventajas y consejos al crear tu sitio web

.clicked { padding:1px 2px; -moz-border-radius:5px; background:#aaa; }

Mootolools Javascript

EL siguiente código es la implementación Javascript para la biblitoeca Mootools:

window.addEvent('domready',function() {
var lynx = $$('a');
lynx.addEvent('click',function(e) {
lynx.removeClass('clicked'); //remove from others
this.addClass('clicked');
});
});

jQuery Javascript

El siguiente código es la implementación Javascript para la biblioteca jQuery:

$(document).ready(function() {
var lynx = $('a');
lynx.click(function(e) {
lynx.removeClass('clicked');
$(this).addClass('clicked');
});
});

Como ves su implementación es muy simple, incluso aunque cuando no conozcas ni jQuery ni Mootools.

iPhone Click Effect Using MooTools or jQuery

Sitio: davidwalsh.name/iphone-click

Tags: CSSCuriosidadefcto linkiphoneJavascriptJavascriptjquery totorialmootools tutorialRecursosSoftware libretutorialTutoriales
Diego Cambiaso

Diego Cambiaso

Comunicador Social y Desarrollador de Software. Blogger desde el 2006, creador de Pixelco Tech News. Viajero y fotógrafo. Entusiasta del diseño, apasionado por la tecnología y el social media. EN-ES-IT

RelacionadoEntradas

Tutorial: análisis de la composición corporal con el Galaxy Watch4

08/12/2021

Cómo sacar provecho del asistente de voz del TV

23/08/2021
Remo Photo Recovery

Remo Photo Recovery – Cómo recuperar fotos borradas (review y tutorial)

10/08/2021

Ya están los ganadores del iPhone Photography Award 2020

23/07/2020

Business TV la solución de Samsung para mostrar contenido personalizado en los televisores de tu negocio

19/05/2022

Huawei lanza el nova Y70, el smartphone que se convierte en power bank

17/05/2022

Bespoke: la nueva línea de neveras modulares y personalizables

13/05/2022

Nuevos audífonos Xiaomi Buds 3 y Xiaomi Buds 3T Pro

05/05/2022

Nueva Series 12 de Xiaomi – Detalles y ficha técnica

05/05/2022

Samsung anunció el Universal Flash Storage (UFS) 4.0

04/05/2022

Pixelco Tech

Pixelcoes sitio de noticias de tecnología, diseño y desarrollo web e Internet escrito por profesionales.

Objetivo de Pixelco

Informar, promocionar, proporcionar recursos y ayuda sobre el diseño y desarrollo web, estándares, Internet y tecnología.

Buscar

Sin resultados
Ver todos los resultados

© 2022 Pixelco Tech News - Internet & Tecnología - Por Diego Cambiaso.

  • Publicidad
  • Contacto
  • Política de Privacidad
  • Sobre Pixelco
  • Internet
    • Recursos
    • Diseño
    • Desarrollo/programación
  • Tecnología
  • Noticias
  • Fotografía

© 2022 Pixelco Tech News - Internet & Tecnología - Por Diego Cambiaso.

Este sitio web utiliza cookies para que usted tenga la mejor experiencia de usuario. Si continúa navegando está dando su consentimiento para la aceptación de las mencionadas cookies y la aceptación de nuestra política de cookies Política de privacidad.
 

Cargando comentarios...