Es posible sólo ejecutar ciertas secuencias de comandos jQuery si la pantalla/tamaño del dispositivo está por encima de xxx píxeles de ancho?

Así, por ejemplo, sólo quiero ejecutar una presentación de diapositivas cuando la gente está viendo el sitio en los dispositivos más grande que la de 1024px. Si alguien visita en un móvil me gustaría que todos los mostrar las imágenes apiladas en la parte superior de uno al otro…

  • Sí. Comprobar el ancho de la pantalla, a continuación, llamar a la función que usted necesita.
  • Si usted no se preocupan por sus js la carga de la presentación de diapositivas en tamaños de pantalla más pequeños, también puede ocultar la presentación de diapositivas mediante consultas de medios css en el navegador de tamaño menor que 1024. Otra cosa a tener en cuenta es que js ancho de la ventana es diferente de consulta de medios css ancho de la ventana, en algunos navegadores. Asegúrese de que tiene una función de cambiar el tamaño a cuidar de tamaño de comportamiento
InformationsquelleAutor Dean Elliott | 2013-06-21

5 Comentarios

  1. 64

    Puede utilizar $(window).width()

    if($(window).width() >= 1024){
      //do your stuff
    }

    Demo ---> http://jsfiddle.net/fh2eC/1/

    • Podría potencialmente reducir el tamaño de los móviles archivo de secuencia de comandos o no?
    • mejor para proporcionar una variable independiente por $(window).width(), para poder volver a utilizarlo si es necesario: var windowWidth = $(window).width().
  2. 22

    Si quieres comprobar el ancho de tamaño después de que windows se cambia el tamaño a continuación:

    $(window).resize(function() {
        if( $(this).width() > width ) {
            //code
        }
    });
    • He intentado esto en combinación con una secuencia de comandos para establecer la igualdad de alturas en diferentes contenedores en la página. $(window).resize(function(){ if( $(this).width() > '480px' ) { equalheight('.divContainerName'); } }); pero no funcionó. algún consejo? (lo siento por varias presenta, tener un teclado problemas!)
    • tengo trabajo mediante la eliminación de las comillas alrededor de la anchura, y la eliminación de la px
  3. 0

    Sólo utilice el siguiente:

    if($(window).width() >= 1024){
        //your code here
    }

    Esto funciona, pero recuerda poner el script al final de la página en lugar de al principio, de lo contrario va a terminar con resultados mixtos. También me gustaría evitar su uso dentro de un documento.listo() el evento si usted está planeando utilizar para aplicar los estilos de cualquier tipo como puede haber una pequeña pero notable retraso en la aplicación de dicho estilos.

  4. -3

    Puede usar una función, a continuación, establecer un intervalo para comprobar el tamaño de cada 10 mill…….
    Aquí….

    function change(){
    document.getElementById("p").innerHTML = window.innerWidth;
    }
    
    setInterval(change, 10);

Dejar respuesta

Please enter your comment!
Please enter your name here