Nullbeta test met curvyCorners
Afgeronde hoeken met curvy corners javascript
Introductie
Via een artikel op Download Squad belandde ik op Curvy Corners. Curvy Corners heeft een leuk javascript in de aanbieding om DIV elementen, slechts op basis van een stukje javascript, te voorzien van afgeronde hoeken.
Nu zijn er natuurlijk meerdere wegen die naar Rome (of in dit geval naar het land van de ronde hoeken) leiden. Zo kun je gaan voor de bijkans pre-historische werkwijze van tabellen waarin een tweetal afbeeldingen zorgen voor de ronding van de hoeken.
Zelf hanteerde ik tot nu toe een oplossing met cascading style sheets en achtergrond afbeeldingen om kaders met ronde hoeken te creëren. Het werkt naar behoren, maar ik ben de eerste om toe te geven dat het niet echt de meest charmante manier is om je kaders vorm te geven.
Dan is de Curvy Corners manier om kaders te voorzien van ronde hoeken zonder twijfel eleganter en flexibeler. Wat heeft Curvy Corners zoal in petto?
- Afgeronde hoeken op basis van javascript
- Geen afbeelding noodzakelijk voor het maken van de ronde hoeken
- Ondersteuning van anti-aliasing
- Ondersteuning van achtergrondafbeeldingen in het afgeronde kader
- Toepasbaar in vloeibare layouts
- Aanpasbare ronding van de hoeken
Het curvyCorners javascript in actie
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet dolor sit amet, consectetuer adipiscing elit. Donec vel ligula eget purus ultricies laoreet. Fusce consequat sodales sapien. Sed laoreet iaculis eros. Vestibulum vestibulum scelerisque lacus. Sed et augue. Duis dui. Vestibulum elit dui, lacinia nec, sagittis vitae, cursus eget, enim. Nulla non massa. Etiam ac arcu. Suspendisse potenti. Donec arcu.
Etiam posuere pede tincidunt ligula. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Ut id ligula non pede egestas pulvinar. Nulla in urna. Phasellus eu eros ac purus cursus porttitor. Nulla vitae mi sed diam suscipit volutpat. Donec arcu mauris, pulvinar id, ultrices eget, varius vel, purus. Vivamus hendrerit. Donec venenatis adipiscing urna. Phasellus ut lectus. Nunc auctor arcu ac ante. Phasellus rhoncus, urna eget tempor laoreet, est augue condimentum ligula, eu tempus wisi lacus ut justo. Nullam congue, turpis in accumsan rhoncus, purus eros egestas diam, quis luctus nisl tellus sed eros. Nulla posuere. Praesent luctus wisi ac massa. Vivamus sapien. Curabitur venenatis purus eu ipsum. Suspendisse ante mauris, pulvinar quis, aliquam eleifend, interdum ut, sapien.
Lorem ipsum dolor sit amet
Lorem ipsum dolor sit amet dolor sit amet, consectetuer adipiscing elit. Donec vel ligula eget purus ultricies laoreet. Fusce consequat sodales sapien. Sed laoreet iaculis eros. Vestibulum vestibulum scelerisque lacus. Sed et augue. Duis dui. Vestibulum elit dui, lacinia nec, sagittis vitae, cursus eget, enim. Nulla non massa. Etiam ac arcu. Suspendisse potenti. Donec arcu.
Etiam posuere pede tincidunt ligula. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Ut id ligula non pede egestas pulvinar. Nulla in urna. Phasellus eu eros ac purus cursus porttitor. Nulla vitae mi sed diam suscipit volutpat. Donec arcu mauris, pulvinar id, ultrices eget, varius vel, purus. Vivamus hendrerit. Donec venenatis adipiscing urna. Phasellus ut lectus. Nunc auctor arcu ac ante. Phasellus rhoncus, urna eget tempor laoreet, est augue condimentum ligula, eu tempus wisi lacus ut justo. Nullam congue, turpis in accumsan rhoncus, purus eros egestas diam, quis luctus nisl tellus sed eros. Nulla posuere. Praesent luctus wisi ac massa. Vivamus sapien. Curabitur venenatis purus eu ipsum. Suspendisse ante mauris, pulvinar quis, aliquam eleifend, interdum ut, sapien.
[ vorige pagina ] [ nullbeta.net voorpagina ]