Yo tener las siguientes jQuery que se encuentra a la altura de una capacidad de respuesta de imagen:

        $(document).ready( function() { //Fires when DOM is loaded
            getImageSizes();
            $(window).resize(function() { //Fires when window is resized
                getImageSizes();
            });
        });
        function getImageSizes() {
            $("#slideshow img").each(function() {
                var $height = $(this);
                console.log( $height.height() );

            });

        }

Y mi objetivo es utilizar los $altura variable para especificar la altura de un div con el ID de la presentación de diapositivas.

Asumo que puede usar este:

$('#slideshow').css({'height': $height + 'px;'});

Sin embargo no es de trabajo (no de altura se especifica).

He incluido por encima de la línea así:

        $(document).ready( function() { //Fires when DOM is loaded
            getImageSizes();
            $(window).resize(function() { //Fires when window is resized
                getImageSizes();
            });
        });
        function getImageSizes() {
            $("#slideshow img").each(function() {
                var $height = $(this);
                console.log( $height.height() );

                $('#slideshow').css({'height': $height + 'px;'});
            });

        }

Hay algo que me estoy perdiendo?

  • Podemos ver esto en un jsfiddle?
  • Usted no entiende que el height de #slideshow va a ser la altura de la última imagen. Así que si la última imagen en $("#slideshow img") altura es de 10, a continuación, que es lo que tu #slideshow altura va a ser.
  • Todavía no estoy seguro. La buena noticia es que cada imagen es de la misma altura, por lo que yo estaba pensando en la primera conclusión a la altura de la capacidad de respuesta de la imagen y, a continuación, añadir una constante que se ve bien en todas las ventanas o, la adición de un porcentaje extra.

4 Comentarios

  1. 4

    Iniciar la $height.height(), pero sólo el uso de $height en el CSS.

    Si el nombre de las variables mejor, sería más fácil :p

    var $height = $(this).height();
    $("#slideshow").css({"height":$height+"px"});

    O mi preferencia:

    document.getElementById('slideshow').style.height = this.height+"px";
    • cualquier razón para js versión de preferencia, otros que el rendimiento ? :O
    • Creo que el rendimiento es una razón suficientemente buena. Yo no han existido, en los días donde 8Kb fue una gran cantidad de memoria, pero ustedes no saben de mi obsesión con eficiencia!
    • Sí, lo es. Yo era sólo curiosidad y estaba pensando si puedo aprender algo nuevo 🙂
    • Bueno, tengo este trabajo. Lo siento, he encontrado el código de un desbordamiento de pila pregunta. Soy muy nuevo en jQuery! Parece que mi función no es llegar a una altura de carga de la página, sólo en el tamaño. Alguna sugerencia?
  2. 1

    $height es una variable jQuery. Usted necesita para obtener la altura de la misma llamando a .height().

    $('#slideshow').css({'height': $height.height() + 'px'});

    O, usted podría almacenar la altura real como una variable de un lugar.

    var height = $(this).height();
    $('#slideshow').css({'height': height  + 'px'});
    • Gracias por su ayuda. Parece que la función getImageSizes(); no ser despedido correctamente en la página de carga. Pero no funciona correctamente en cambiar el tamaño de ahora. La consola de informes de un valor de 0 en la página de carga. Alguna idea?
    • Trate de poner la función en el interior del jQuery.listo función.
  3. 1

    Va a guardar el objeto jQuery $(this) para la variable $height

    Hacer: var $height = $(this).height(); y estará todo listo.

    • Gracias por su ayuda. Parece que la función getImageSizes(); no ser despedido correctamente en la página de carga. Pero no funciona correctamente en cambiar el tamaño de ahora. La consola de informes de un valor de 0 en la página de carga. Alguna idea?
  4. 1

    El problema está en el controlador de eventos:

            function() {
                var $height = $(this);
                console.log( $height.height() );
    
                $('#slideshow').css({'height': $height + 'px;'});
            }

    Usted está tratando de hacer $height (que es un objeto jQuery) concatenado con 'px;' (una cadena). Esto termina con la cadena '[object Object]px;', que, obviamente, no es lo que usted desea. Usted necesidad de utilizar el valor de la altura del lugar. Esto, creo, es lo que usted desea:

            function() {
                var height = $(this).height();
                console.log( height );
    
                $('#slideshow').css({'height': height + 'px'});
            }
    • Gracias por su ayuda. Parece que la función getImageSizes(); no ser despedido correctamente en la página de carga. Pero no funciona correctamente en cambiar el tamaño de ahora. La consola de informes de un valor de 0 en la página de carga. Alguna idea?

Dejar respuesta

Please enter your comment!
Please enter your name here