CSS3 Tabellen mit runden Ecken

Montag, 23. Januar 2012

Mit Hilfe von CSS3 kann man Tabellen runde Ecken und damit eine etwas abwechslungsreichere Optik verleihen. Zu beachten ist jedoch, dass man nicht einer ganze Tabelle (<table>) abgerundete Ecken “verpassen” kann, sondern die runden Ecken müssen auf die Zellen (<td>) übertragen werden, welche abgerundet erscheinen sollen. Durch Verwendung folgender CSS2-Selektoren (: first-child etc.) und der CSS3-Eigenschaften “border-radius” kann man diese vier außeren Ecken abrunden:
 

table.mit_runden_ecken tr:first-child td:first-child { border-top-left-radius: 15px; }
table.mit_runden_ecken tr:first-child td:last-child { border-top-right-radius: 15px; }
table.mit_runden_ecken tr:last-child td:first-child { border-bottom-left-radius: 15px; }
table.mit_runden_ecken tr:last-child td:last-child { border-bottom-right-radius: 15px; }

Eine noch besser ausgearbeitete Lösung findet man bei Red Team Design:

css3 round corner tables

Zur DEMO-Website

Popularity: 1% [?]

Point of Interest (POI) Icons

Donnerstag, 17. November 2011

Immer wieder mal braucht man sie: Icons  um POIs (Points of Interest) zu markieren. Die Map Icons Collection ist eine Sammlung von mehr als 700 kostenlosen Map Icons. Sie können für Google Maps oder sonstige Markierungen verwendet werden.

Die Icons sind in Kategorien unterteilt und übersichtlich geordnet. Besonders praktisch ist, dass man die gewünschten Farbwerte auf der Website definieren kann und die Icons werden dann individuell generiert.

Website: http://mapicons.nicolasmollet.com/


Popularity: 1% [?]

TYPO3 Platzhalterbild für tt_news

Donnerstag, 17. November 2011

Man kann für die TYPO3 Extension tt_news auf einfache Art ein Platzhalterbild definieren. Das ist oftmals sehr praktisch, damit das Layout einheitlich bleibt, auch wenn es zu einem News-Eintrag mal kein Bild gibt:

plugin.tt_news.displayLatest.image.noImage_stdWrap {
    cObject = IMAGE
    cObject {
        file = fileadmin/img/news_ohne_Bild.gif
        wrap =
    }
}

Popularity: 1% [?]

Eindrucksvolle jQuery-Slider

Freitag, 9. September 2011

Eine Auswahl der 50 besten jQuery-Slider

jQuery-Slider werden häufig für die dynamische Darstellung von Beiträgen, Produkten und Galerien verwendet und vor allem auf modernen Webseiten eingesetzt. Früher wurde diese Art der Darstellung meist mit Flash umgesetzt. Da JavaScript und Html jedoch bei weitem suchmaschinenfreundlicher sind, haben sich die zahlreichen JavaScript Frameworks und allem voran jQuery inzwischen durchgesetzt.

Schön ist auch, dass es für fast jedes Vorhaben bereits fertige jQuery Plugins gibt. Eine schöne Zusammenstellung verschiedenster jQuery Slider ist nun auf antsmagazine.com zu finden. 50 der besten Slider wurden hier in einer Übersicht zusammengestellt:

http://www.antsmagazine.com/50-jquery-sliders-you-will-love-to-use

Rotating Image Slider With Jquery [DEMO]

rotating jquery image slider

 

Beispiel jQFullscreen Gallery With Thumnail Flip [DEMO]

Beispiel jQuery-Slider ImageFlow [DEMO]:

Image Flow jQuery

URL: http://www.antsmagazine.com/50-jquery-sliders-you-will-love-to-use

Popularity: 2% [?]

Seiten: 1 2 3 4 5 6 7 8 9 10 ...15 16 17 Weiter

blogCloud bloggerei.de supported by www.rankingcloud.de Gelistet im Blog Verzeichnis