Wie man Punkt, wo divs stop schrumpft mit der browser-Größe

Gibt es eine Menge von dynamisch gestaltete websites gibt, wo es divs oder Bilder schrumpfen, wie die browser-Größe verringert.

Ein Beispiel HIERFÜR wäre http://en.wikipedia.org/wiki/Main_Page

Den div in dem der text ist im schrumpfen, wie die browser-Größe verringert. Dies geschieht bis zu einem bestimmten Punkt, wo es einfach entscheidet zu stoppen schrumpfen, und nur beginnen, decken Sie die Textfelder aus.

Möchte ich diese Wirkung mit einem JSFiddle arbeite ich an:
http://jsfiddle.net/MrLister/JwGuR/10/

Wenn Sie dehnen die Größe der Geige, sehen Sie die Bilder dynamisch anpassen.
Das Ziel ist es, einfach aufhören zu schrumpfen an einem bestimmten Punkt, und starten Sie einfach die Abdeckung oder Höhlenforschung in auf diese Bilder. Ich möchte dies tun, weil irgendwann wird es so klein, dass Sie text auf jedes Bild überlappt, und es sieht schlecht aus.

Hier ist die CSS für die Geige:

.figure {
    position: relative;
    display:inline-block;
    max-width: 33%;
}

.figure .figcaption {
    text-align: center;
    height:0;
    top: 40%;
    width: 100%;
    font-size: 55px;
    color: white;
    position: absolute;
    z-index: 1;
}

.figure img {
    display: block;
    max-width: 100%;
}
Schreibe einen Kommentar