- - שכבת-על תמונות בכל HTML / אתר להשוואה לפי פיקסל [Chrome]

שכבת-על תמונות בכל HTML / אתר להשוואה לפי פיקסל [Chrome]

PerfectPixel, סיומת Chrome, מאפשרת למפתחי אתרים ו-מעצבים שכיסו בקלות תמונה שקופה למחצה בחלקו העליון של אתר HTML מפותח. על ידי העברת התמונה בדף אינטרנט, מפתחים יכולים לראות חזותית את ההבדל בפיקסלים. לתוסף יש גם אפשרות אטימות, המאפשרת להציג גם את שכבת-העל וגם את ה- HTML שפותח. כשאתה מעביר את התמונה מסביב, הקואורדינטות מתעדכנות אוטומטית בקופץ המוקדם של PerfectPixel, אשר לאחר מכן ניתן להעתיק ולהשתמש בהן על ידי מפתחי אתרים.

לאחר התקנת התוסף, לחץ על הכפתור בסרגל הכלים וקופץ יופיע בדף האינטרנט שלך. לחץ על הוסף שכבה חדשה ובחר קובץ מהמערכת המקומית שלך. תמונה זו תתווסף מייד כשכבה דרך דף האינטרנט. אתה יכול הצג הסתר תמונות וגם לבחור תמונות שונות. הזז את התמונה כדי לבדוק אותה אחרתעמדות והקואורדינטות יעודכנו אוטומטית בפופ-אפ. אתה יכול להוסיף כמה תמונות שאתה רוצה, ולבחור תמונות מסוימות על ידי לחיצה עליהן. לאחר שהתמונה ממוקמת נכון, תוכלו להשתמש בקואורדינטות המעודכנות כדי למקם את התמונה באמצעות CSS. היזם הזכיר תמיכה מרובת שכבות; עם זאת, הבדיקה שלנו הניבה חוסר יכולת להוסיף שכבות מרובות.

PerfectPixel (2)

ה- PerfectPixel אפשרויות מאפשר לך להפעיל את מצב תאימות אחסון, שנמצא כדי לפתור בעיות תאימות בהעלאת תמונות. עם זאת, מגבלה אחת בשימוש במצב תאימות היא שגודל הקובץ מוגבל למקסימום של 1.5 מגה בייט. תוכל גם להפעיל את ה- מצב ניפוי באגים ו מקשי קיצור.

אפשרויות

עם זאת, הבדיקות שלנו הראו שבזמן שאתה יכוללהוסיף שכבות מרובות, אתה יכול להציג רק שכבה אחת בכל פעם בעמוד נתון. זוהי מגבלה מצערה והמפתח צריך לשקול לשנות אותה כך שניתן יהיה לראות מספר שכבות בבת אחת. כפתור 'נעילה' שומר את המיקום של שכבת תמונה שהוספת ואף אם תצא מהסיומת (לחץ שוב על הלחצן שלו כך שהחלונית תיעלם) הוא יזכור את המיקום של התמונות האלה כשאתה פותח אותה בהמשך.

תוסף PerfectPixel הוא כלי די שימושי למפתחי ומעצבי אתרים, וזמין בקישור של חנות האינטרנט של Chrome למטה.

התקן את PerfectPixel עבור Google Chrome

הערות