Nyligen skrev jag en artikel om CSS3: Rundade CSS Corners , vilket är en bra lösning för att skapa rundade hörn. Men Internet Explorer ännu inte stödja det, men det finns en lösning som denna artikel förklarar.
De följande två länkarna visa en fungerande version och även en zip-fil så att du kan ladda ner allt du behöver för att få detta att fungera.
HTML är ganska rakt framåt och använder koden från en annan artikel - HTML5 handledning: Komma igång .
För att få de rundade hörnen som arbetar i IE behöver du JQuery och JQuery hörnet script som båda ingår i ovanstående zip-filen som jag har sedan refereras från HTML.
<script src="js/jquery-1.3.2.min.js"></script>
<script src="js/jquery.corner.js"></script>
Nu ska du bara behöver tala om för webbläsaren vilket hörn du vill ska avrundas.
<script>
$("#container").corner();
$("section").corner();
$("aside").corner();
$("#main-navigation a").corner("top 5px");
</script>
Om du är bekant med CSS alls så ska du enkelt kunna se hur detta tillämpas med hjälp av JavaScript som vi helt enkelt använda elementet, ID eller klass inom citationstecken för att rikta den delen av HTML.
Sammanfattning
Och det är allt som finns till den. Du kan skapa alla typer av rundade hörn effekter som visas på rundade hörn demo site . Fram tills nu har jag alltid skapat rundade hörn med hjälp av denna metod , men se enkelheten i det Jquery lösning jag frestad att byta för Internet Explorer minst och är beroende av CSS3 för Webkit och Mozilla webbläsare.
Vad tycker ni? Använder du stillbilder med rundade hörn lösningar eller är JavaScript och CSS3 metoder blir allt mer omfattande spridning i utvecklingen samhället?
Tack Ram, hjälpte denna lösning mig mycket. Letar du efter så bra artiklar från dig.