Skip to main content
Corrección acentuación y formato, agregar etiqueta relevante
Origen Enlace

Quisiera lograr una galería de imágenes traídas desde una base de datos utilizando Bootstrap pero asignarle clases distintas para que no se vea como la típica galería, por ejemplo, que una imagen cuente con la clase col-lg-4, la segunda col-lg-2, etc, no sé si me explico. Hasta ahora he logrado traerlas pero se les aplica la misma clase a todas ya que lo hago de la siguiente manera:

function showGallery() {
    global $conexion;
    $pic_sql = "SELECT id, url_image FROM pictures WHERE status = 'A'";    
    if ($pics_query = mysqli_query($conexion, $pic_sql)) {
        $pics_rs = mysqli_fetch_assoc($pics_query);
    }
    do {
        ?>
        <div class='container-img col-lg-4'>
            <img src="img/<?php echo $pics_rs['url_image'] ?>" id="myImg-<?php echo $pics_rs['id'] ?>" name="<?php echo $pics_rs['id'] ?>" class="col-lg-12 myImg">        
        </div>
        <?php
    } while ($pics_rs = mysqli_fetch_assoc($pics_query));
}
?>

He retomado ésto después de tiempo y ya ni recuerdo, ya he buscado en internetInternet pero todo lo que voy encontrando es como hacer una en donde todas tienen el mismo tamaño.

Lo único que se me ocurre por ahora sería añadirle un campo adicional con el número que quiero que ocupe y hacer un if en donde pregunte si ese campo es igual a 'x' número entonces que aplique tal estilo.

Cualquier consulta o dato adicional que precisen solo diganme.

Desde ya, gracias.

Quisiera lograr una galería de imágenes traídas desde una base de datos utilizando Bootstrap pero asignarle clases distintas para que no se vea como la típica galería, por ejemplo, que una imagen cuente con la clase col-lg-4, la segunda col-lg-2, etc, no sé si me explico. Hasta ahora he logrado traerlas pero se les aplica la misma clase a todas ya que lo hago de la siguiente manera:

function showGallery() {
    global $conexion;
    $pic_sql = "SELECT id, url_image FROM pictures WHERE status = 'A'";    
    if ($pics_query = mysqli_query($conexion, $pic_sql)) {
        $pics_rs = mysqli_fetch_assoc($pics_query);
    }
    do {
        ?>
        <div class='container-img col-lg-4'>
            <img src="img/<?php echo $pics_rs['url_image'] ?>" id="myImg-<?php echo $pics_rs['id'] ?>" name="<?php echo $pics_rs['id'] ?>" class="col-lg-12 myImg">        
        </div>
        <?php
    } while ($pics_rs = mysqli_fetch_assoc($pics_query));
}
?>

He retomado ésto después de tiempo y ya ni recuerdo, ya he buscado en internet pero todo lo que voy encontrando es como hacer una en donde todas tienen el mismo tamaño.

Lo único que se me ocurre por ahora sería añadirle un campo adicional con el número que quiero que ocupe y hacer un if en donde pregunte si ese campo es igual a 'x' número entonces que aplique tal estilo.

Cualquier consulta o dato adicional que precisen solo diganme.

Desde ya, gracias.

Quisiera lograr una galería de imágenes traídas desde una base de datos utilizando Bootstrap pero asignarle clases distintas para que no se vea como la típica galería, por ejemplo, que una imagen cuente con la clase col-lg-4, la segunda col-lg-2, etc, no sé si me explico. Hasta ahora he logrado traerlas pero se les aplica la misma clase a todas ya que lo hago de la siguiente manera:

function showGallery() {
    global $conexion;
    $pic_sql = "SELECT id, url_image FROM pictures WHERE status = 'A'";    
    if ($pics_query = mysqli_query($conexion, $pic_sql)) {
        $pics_rs = mysqli_fetch_assoc($pics_query);
    }
    do {
        ?>
        <div class='container-img col-lg-4'>
            <img src="img/<?php echo $pics_rs['url_image'] ?>" id="myImg-<?php echo $pics_rs['id'] ?>" name="<?php echo $pics_rs['id'] ?>" class="col-lg-12 myImg">        
        </div>
        <?php
    } while ($pics_rs = mysqli_fetch_assoc($pics_query));
}
?>

He retomado ésto después de tiempo y ya ni recuerdo, ya he buscado en Internet pero todo lo que voy encontrando es como hacer una en donde todas tienen el mismo tamaño.

Lo único que se me ocurre por ahora sería añadirle un campo adicional con el número que quiero que ocupe y hacer un if en donde pregunte si ese campo es igual a 'x' número entonces que aplique tal estilo.

Origen Enlace

Galeria de imágenes traídas desde una base de datos con diferentes tamaños

Quisiera lograr una galería de imágenes traídas desde una base de datos utilizando Bootstrap pero asignarle clases distintas para que no se vea como la típica galería, por ejemplo, que una imagen cuente con la clase col-lg-4, la segunda col-lg-2, etc, no sé si me explico. Hasta ahora he logrado traerlas pero se les aplica la misma clase a todas ya que lo hago de la siguiente manera:

function showGallery() {
    global $conexion;
    $pic_sql = "SELECT id, url_image FROM pictures WHERE status = 'A'";    
    if ($pics_query = mysqli_query($conexion, $pic_sql)) {
        $pics_rs = mysqli_fetch_assoc($pics_query);
    }
    do {
        ?>
        <div class='container-img col-lg-4'>
            <img src="img/<?php echo $pics_rs['url_image'] ?>" id="myImg-<?php echo $pics_rs['id'] ?>" name="<?php echo $pics_rs['id'] ?>" class="col-lg-12 myImg">        
        </div>
        <?php
    } while ($pics_rs = mysqli_fetch_assoc($pics_query));
}
?>

He retomado ésto después de tiempo y ya ni recuerdo, ya he buscado en internet pero todo lo que voy encontrando es como hacer una en donde todas tienen el mismo tamaño.

Lo único que se me ocurre por ahora sería añadirle un campo adicional con el número que quiero que ocupe y hacer un if en donde pregunte si ese campo es igual a 'x' número entonces que aplique tal estilo.

Cualquier consulta o dato adicional que precisen solo diganme.

Desde ya, gracias.