Πώς να κάνει Curved Corners Javascript για IE

Ενώ οι περισσότερες μεγάλες μηχανές αναζήτησης υποστηρίζουν το CSS ( Cascading Style Sheets ) περιουσία που θα καταστήσει τα στοιχεία HTML με καμπύλες γωνίες , ο Internet Explorer 8 και κάτω δεν μοιράζονται αυτό το χαρακτηριστικό . Αυτό έχει αφήσει πολλούς προγραμματιστές Web ψάχνουν για έναν ξεχωριστό τρόπο για να προσφέρουν κυρτές γωνίες στον Internet Explorer χωρίς την προσθήκη γενικών εξόδων για τη ροή εργασίας τους . Ευτυχώς , υπάρχουν αρκετές λύσεις JavaScript διαθέσιμα που προσομοιώνουν τη συμπεριφορά της ιδιοκτησίας στα σύνορα - ακτίνα του CSS . Οδηγίες
Η 1

Απασχολούν ένα plugin όπως το jQuery Plugin Corner , εάν είστε ένας προγραμματιστής που χρησιμοποιεί ήδη jQuery στην ιστοσελίδα του . Κατεβάστε το plugin και να τοποθετήσετε το αρχείο ( ες) στο διακομιστή Web σας? Τότε , σύνδεση με τα μέσα στην ετικέτα κεφάλι στη σελίδα σας . Για παράδειγμα , εάν τα αρχεία είναι στον ίδιο κατάλογο με τη σελίδα :

Προσθέστε την επιχείρηση σας src="jquery-1.4.2.min.js"> ?

Προσθέστε την επιχείρηση σας src="jquery.corner.js">

συνέχεια να καλέσετε τη συνάρτηση jQuery που πρόκειται να στρογγυλεύουν τις γωνίες στον Internet Explorer , είτε μέσα σε ένα tag δεσμών ενεργειών στην κορυφή της σελίδας ή σε ένα εξωτερικό αρχείο JavaScript . Με jQuery Plugin Corner , ο κώδικας μπορεί να μοιάζει κάπως έτσι :

$ ( " roundedBox . » ) Γωνία ( "bottom 20px ")?

Το πρώτο τμήμα σε παρένθεση προσδιορίζει το στοιχείο στόχου ( . s ) , σε αυτή την περίπτωση τα στοιχεία με το όνομα της κλάσης του " roundedBox . " Το δεύτερο τμήμα στις παρενθέσεις είναι για τις επιλογές . Οι επιλογές περιλαμβάνουν τον τύπο του γωνία, τη γωνία ή γωνίες να επηρεαστεί και η ακτίνα της καμπύλης . 2

Επιλέξτε ένα stand-alone λύση , όπως τα CurvyCorners JavaScript βιβλιοθήκη . Κατεβάστε και σύνδεση με τη βιβλιοθήκη μέσα στην ετικέτα της κεφαλής της σελίδας σας . Για παράδειγμα :

Προσθέστε την επιχείρηση σας src="curvycorners.js">

Έπειτα ορίστε CSS σύνορα ακτίνας χαρακτηριστικά για τα στοιχεία που πρέπει έχουν στρογγυλεμένες γωνίες :

roundedBox {

- webkit - σύνορα - ακτίνα: 20px ?

- moz - σύνορα - ακτίνα: 20px ?

} .

το πρώτο ακίνητο είναι WebKit -based browsers , συμπεριλαμβανομένου του Safari και Chrome , ενώ το δεύτερο είναι για το Mozilla -based browsers όπως ο Firefox . CurvyCorners αναλύει το CSS , εντοπίζει αυτούς τους ορισμούς και τους εφαρμόζει στον Internet Explorer .
Εικόνων 3

Επωφεληθείτε από HTML Εξαρτήματα, έναν μηχανισμό που ανέπτυξε η Microsoft να ενσωματώσει τη δυναμική συμπεριφορά σε ιστοσελίδες του . Συστατικά είναι απλά JavaScript αρχεία με επέκταση. Htc που επηρεάζουν μόνο τον Internet Explorer . Ένα αρχείο δωρεάν . Htc που προσθέτει μια συμπεριφορά για την ιδιότητα CSS σύνορα ακτίνας έχει κυκλοφορήσει . Κατεβάστε το αρχείο και τοποθετήστε το σε μια προσβάσιμη θέση στο χώρο Web ? Στη συνέχεια , προσθέστε μια «συμπεριφορά» ακίνητο που οδηγεί στο αρχείο htc παράλληλα με το CSS που ορίζει την ιδιότητα των συνόρων ακτίνα. . . Για παράδειγμα :

roundedBox {

- moz - σύνορα - ακτίνα: 20px ?

- Webkit - σύνορα - ακτίνα: 20px ?

Σύνορα ακτίνα: 20px ?

συμπεριφορά : url ( σύνορα radius.htc ) ?

}
Η
εικόνων