Επικάλυψη εικόνων σε οποιονδήποτε HTML / ιστότοπο για σύγκριση ανά pixel [Chrome]

PerfectPixel, μια επέκταση Chrome, επιτρέπει στους προγραμματιστές ιστού και τους σχεδιαστές να επικαλύπτουν εύκολα μια ημιδιάφανη εικόνα πάνω από έναν ανεπτυγμένο ιστότοπο HTML. Μετακινώντας την εικόνα σε μια ιστοσελίδα, οι προγραμματιστές μπορούν να δουν οπτικά τη διαφορά στα pixel. Η επέκταση έχει επίσης μια επιλογή αδιαφάνειας, η οποία σας επιτρέπει να δείτε τόσο την επικάλυψη όσο και το HTML που έχει αναπτυχθεί. Καθώς μετακινείτε την εικόνα, οι συντεταγμένες ενημερώνονται αυτόματα στο αναδυόμενο παράθυρο PerfectPixel, το οποίο στη συνέχεια μπορεί να αντιγραφεί και να χρησιμοποιηθεί από προγραμματιστές ιστού.

Μόλις εγκαταστήσετε την επέκταση, κάντε κλικ στο κουμπί στη γραμμή εργαλείων και θα εμφανιστεί ένα αναδυόμενο παράθυρο στην ιστοσελίδα σας. Κάντε κλικ Προσθέστε νέο επίπεδο και επιλέξτε ένα αρχείο από το τοπικό σας σύστημα. Αυτή η εικόνα θα προστεθεί αμέσως ως επίπεδο πάνω στην ιστοσελίδα. Μπορείς Εμφάνιση απόκρυψη εικόνες και επίσης επιλέξτε διαφορετικές. Μετακινήστε την εικόνα γύρω για να τη δοκιμάσετε σε διαφορετικές θέσεις και οι συντεταγμένες θα ενημερώνονται αυτόματα στο αναδυόμενο παράθυρο. Μπορείτε να προσθέσετε όσες εικόνες θέλετε και να επιλέξετε συγκεκριμένες κάνοντας κλικ σε αυτές. Μόλις η εικόνα τοποθετηθεί σωστά, μπορείτε να χρησιμοποιήσετε τις ενημερωμένες συντεταγμένες για να τοποθετήσετε την εικόνα σας μέσω CSS. Ο προγραμματιστής ανέφερε πολλαπλή υποστήριξη επικάλυψης. Ωστόσο, οι δοκιμές μας απέδωσαν αδυναμία προσθήκης πολλών επιπέδων.

Το PerfectPixel Επιλογές σας επιτρέπουν να ενεργοποιήσετε το Λειτουργία συμβατότητας αποθήκευσης, που υπάρχει για την επίλυση προβλημάτων συμβατότητας με τη μεταφόρτωση εικόνων. Ένας περιορισμός της χρήσης της λειτουργίας συμβατότητας, ωστόσο, είναι ότι το μέγεθος του αρχείου περιορίζεται σε 1,5 MB το μέγιστο. Μπορείτε επίσης να ενεργοποιήσετε το Λειτουργία εντοπισμού σφαλμάτων και Hotkeys.

Ωστόσο, οι δοκιμές μας έδειξαν ότι ενώ μπορείτε να προσθέσετε πολλά επίπεδα, μπορείτε να προβάλετε μόνο ένα επίπεδο κάθε φορά σε μια δεδομένη σελίδα. Αυτός είναι ένας ατυχής περιορισμός και ο προγραμματιστής πρέπει να εξετάσει το ενδεχόμενο αλλαγής του έτσι ώστε να μπορούν να προβληθούν ταυτόχρονα πολλά επίπεδα. Το κουμπί "Κλείδωμα" αποθηκεύει τη θέση ενός επιπέδου εικόνας που έχετε προσθέσει και ακόμη και αν βγείτε από την επέκταση (κάντε κλικ στο κουμπί το κουμπί του ξανά, έτσι ώστε ο πίνακας να εξαφανιστεί) θα θυμάται τη θέση για αυτές τις εικόνες όταν ανοίγετε το.

Η επέκταση PerfectPixel είναι ένα αρκετά βολικό εργαλείο για προγραμματιστές και σχεδιαστές ιστού και διατίθεται στον παρακάτω σύνδεσμο Chrome Web Store.

Εγκαταστήστε το PerfectPixel για το Google Chrome