Browse by Tags

html lists -> back to basic
07 February 12 08:48 PM | Shlomo | with no comments

הפוסט הזה מיועד למתחילים בעולם ה - html, בפוסט זה נכיר את הסוגים השונים של רשימות בעולם ה - html. בהרבה מקרים אנו רוצים להציג למשתמש רשימות של מידע, ואנחנו רוצים שזה יאורגן בצורה מסודרת מבלי שנרצה לעבוד קשה מדי כדי לבצע זאת, רשימות יכולות להיות רשימה של פיצ'רים שנתמוך בהם, מסמך משפטי המכיל סעיפים ותתי סעיפים, ואפילו תפריטים ותתי תפריטים. כדי לעשות זאת יש לנו כמה סוגים של רשימות. Unorderd List - מייצר רשימה לא ממוספרת, אלא משתמשת בסימנים (בולטים) כדי להגדיר את כל הרשימה. Orderd List - מייצר רשימה...

תגים:DEV, html

HTML5 - Table of Content
25 January 12 10:58 AM | Shlomo | with no comments

כתבתי די הרבה על נושאים שונים של HTML5, וחשבתי לרכז את כולם. בשונה ממדריכים אחרים שכתבתי, הפוסט הזה אינו מרוכז לפי סדר מסויים, אלא מגוון רחב של פיצ'רים שהסביבה נותנת. אני מחלק את זה לשינויים ב - HTML, תוספות של CSS ופונקציונליות חדשה ב - JS - כמובן שישנם חידושים שחופפים ואפשר היה להצמיד אותם גם ל - CSS וגם ל - JS, אך מיקמתי אותם היכן שנראה לי יותר מתאים. חשוב לשים לב שבחלק מהפוסטים יש כותרת של What new in IE8 וכדומה, אל דאגה - כאן שמתי אך ורק פוסטים של HTML5, כלומר שינויים של IE שמוגדרים מהתקן...

תגים:DEV, html, html5, ie9

center elements in html
17 January 12 08:05 PM | Shlomo | 2 comment(s)

כיצד למרכז אלמנטים בעזרת css. סביר להניח שזה פשוט למי שכבר יודע - אבל למי שלא - הפוסט הזה יכול לחסוך שעות של נסיונות נואשים. אז ככה. בעבר היה דרך (עובד גם היום רק שיצא מהתקן) לכתוב כך: < center > ..... </ center > כל מה שיופיע בתוך התגיות ימורכז, הסיבה שזה יצא מהתקן היא מכיוון שאנחנו אמורים לכתוב ב - html את התוכן ולא את העיצוב. מה שצריך לעשות זה כך: .center { margin-left : auto ; margin-right : auto ; text-align : center ; } אלמנט שיקבל את ה - class המתאים (center) ימורכז - כמובן שהוא...

תגים:DEV, html, CSS

HTML5 - Canvas
16 January 12 08:11 AM | Shlomo | with no comments

בהמשך לפוסטים על HTML5 , הפעם נדבר על Canavs. הקדמה: בפוסט הראשון תיארתי מהו HTML5, וטענתי שזה לא הגרפיקות והאנימציות - אלא ה - API החדש, אבל כמובן שאי אפשר להתעלם מהיכולות של הגרפיקה, ולכן בפרק זה נכיר את הדרך כיצד לצייר ב - HTML5. כמובן שאי אפשר במסגרת פוסט זה להכיר את היכולות המלאות, (וזה גם דורש המון מטמטיקה), ואני די בטוח שיהיו (או שיש) עטיפות שונות ליכולות ה - Canvas כדי להקל את הכתיבה, ולא לכתוב כל כך קרוב לברזלים, ובכל זאת נרצה לראות את הבסיס ואיך משתמשים בזה. Canvas: ה - Canvas הוא בד ציור...

תגים:DEV, JavaScript, html, html5

HTML5 - New Elements
10 January 12 10:39 AM | Shlomo | 1 comment(s)

כפי שהבטחתי בפוסט הקודם אני אדבר הפעם על אלמנטים חדשים ב - HTML5. כמובן שיש יותר מידי אלמנטים חדשים, ולכן אנסה לחלק לוגית בין הסוגים השונים ולספר על חלק מהאלמנטים החדשים מכל סוג. כשאנחנו מנסים לחלק לוגית את האלמנטים החדשים, אנחנו רואים את הסוגים הבאים: אלמנטים לוגיים - כלומר אלמנטים שאין להם כמעט משמעות מבחינת הפונקציונליות שלהם - אלא הם משמשים אותנו לחלוקה הגיונית יותר של האלמנטים בעמוד. אלמנטים אמיתיים - אלמנטים המכילים פונקציונליות חדשה לחלוטין. מאפיינים חדשים - אלמנטים קיימים שקבלו מאפיינים חדשים...

תגים:DEV, html, html5

HTML5 - The Modernizr
04 January 12 10:34 AM | Shlomo | with no comments

בדיקת תמיכת פיצ'ר בדפדפן: כפי שהבטחתי בפוסט הקודם אני אדבר היום איך כותבים ב - HTML5 עם מינימום נזק לדפדפנים שאינם תומכים ב - HTML5. כשנרצה להשתמש בפיצ'רים שונים של HTML5 נרצה לוודא האם הדפדפן תומך בזה - לדוגמא לפני שימוש ב - localStorage וכדו'. כדי לוודא זאת נוכל להוריד ספריית JS חביבה בשם Modernizr . ולכתוב: if (Modernizr.localstorage) { } וכך נוכל לבדוק כל פיצ'ר שנרצה להשתמש איתו ב - JS בבטחה. אוטומציה לתהליך: כמובן שנעדיף מנגנון יותר אוטומטי שיטען קבצי סקריפט שונים במידה והדפדפן...

תגים:DEV, html, html5

HTML5 - HTML Review
01 January 12 08:44 PM | Shlomo | 3 comment(s)

הקדמה: מאז ש כתבתי על כל מיני פיצ'רים ב - HTML5, דברים התווספו והשתנו בתקן ובדפדפנים, אני מתכוון להמשיך לכתוב על פיצ'רים שונים ומשונים של התקן, אך לפני הכול קצת היסטוריה ולמה בכלל אנחנו רוצים לעבוד עם HTML5. היסטוריה: HTML - Hyper Text Markup Language, נולד בשנת 1991 על ידי Tim Berners-Lee, כדרך להעברת טקסט סטטי תמונות ולינקים לדפים סטטים אחרים על גבי הרשת (באותה שנה גם יצא תקן ה - HTTP לאויר העולם). בשנת 1994-1995 העולם התקדם לתקן HTML2 שהכיל פיצ'רים חשובים כמו טבלאות העלאת קבצים וכד'...

תגים:DEV, Web, html, html5

background-position RTL jQuery plugin
25 October 11 09:23 PM | Shlomo | with no comments

כיצד להגדיר background-position כשמדובר באתרים עם rtl ? התחלתי לעצב אתר כשקבלתי עיצוב מותאם לאנגלית והייתי צריך לשנות אותו לעברית, על ההתחלה נתקלתי בבעייה הבאה: נקח לדוגמא את ה - css הבא: body { background-image : url('Penguins.jpg') ; background-repeat : repeat-y ; background-position-x : 30px ; } css פשוט ביותר שיגרום לתמונה מסויימת להתחיל בשלושים פיקסל ימינה, מה יקרה עם נוסיף את השורה הבאה: direction : rtl ; האתר יעבור לצד ימין, כשתמונת הרקע נשארה תקועה בצד שמאל, בעוד שהכוונה כרגע שמצד...

תגים:DEV, JavaScript, html, CSS, jQuery, html5, css3, js

File Upload: Cannot access a closed file.
25 October 11 10:14 AM | Shlomo | 1 comment(s)

אם יצא לכם לכתוב פקד המאפשר להעלות קבצים לשרת, שומר אותם ב - Session ומתי שהוא תנסו לקרוא את התוכן של הקבצים, ייתכן שתקבלו את השגיאה: Cannot access a closed file. ( הורדה של קוד מקור ). בפוסט זה אני אדגים כתיבה של פקד כזה (פקד פשוט מאוד - עבור הדוגמא) וכיצד לפתור את הבעייה. נכתוב דף בשם uploader.aspx, קוד ה - html: < form id ="form1" runat ="server"> < div > < asp : FileUpload runat ="server" ID ="fu1" /> < asp : Button Text ="Upload"...

תגים:DEV, Web, JavaScript, config, html, jQuery

רישום לאירוע בזמן סגירת הדפדפן
29 August 11 04:17 PM | Shlomo | 2 comment(s)

אחד מהדברים שאנחנו כמפתחי WEB נתקלים בהם מידי פעם, היא כיצד לדעת מתי הדפדפן נסגר, בדרך כלל הסיבה שאנחנו רוצים לדעת זאת היא בכדי לנקות Session שאין צורך בו עוד, אך לא רק. הבעייה הגדולה עם הרצון לדעת מתי המשתמש לחץ על ה - X הוא שזה נוגד את חוקי ה - Security של הדפדפן, הפיתרון הלכאורה פשוט הוא להרשם לאירוע unload ולכתוב קוד כלשהו, הבעייה עם השיטה הזו היא שאירוע זה קורה בכל PostBack מה שאומר שאם יש טופס עם לחצנים כל לחצן יפעיל את הקוד שלכאורה אמור להתבצע רק בזמן סגירת הדפדפן. באחד הייעוצים בהם הייתי...

תגים:DEV, JavaScript, html, WebService, iE

New line in html tooltip
08 May 11 04:06 PM | Shlomo | 2 comment(s)

קורה לכם שאתם רוצים להציג tooltip פשוט של html ולהציג מידע בכמה שורות כשאתם מחליטים היכן לבור את השורה, תוכלו לכתוב קוד כזה: < a href ="#" title ="Description:&#13Here is the description&#13&#13Info:&#13Here is the info"> the link </ a > הסימון ;13&# נותן ירידת שורה, וכעת כשעומדים על הלינק זה יראה כך:

תגים:DEV, html

HTML5 Geolocation
13 April 11 08:35 AM | Shlomo | with no comments

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

תגים:DEV, html, html5, ie9, internet Explorer 9

text-shadow CSS3
11 April 11 10:50 AM | Shlomo | with no comments

כחלק מהתקן של CSS3 הגיע מאפיין חדש בשם text-shadow שמגדיר צל עבור טקסט. div { font-family : Arial ; font-size : 55px ; width : 250px ; height : 250px ; border : 1px solid black ; margin : 20px ; padding : 20px ; text-shadow : rgba(0,0,0,0.7) -1px -1px, rgba(0,0,0,0.5) -2px -2px, rgba(0,0,0,0.3) -3px -3px ; background-color : Yellow ; } < div > Sela College Channel </ div > בדוגמא אפשר לראות שמוגדר כמה שבות של צל. התוצאה של הקוד הזה: נכון להיום זה עדיין לא נתמך ב - IE, נקווה שהם יתמכו...

תגים:DEV, html, CSS, html5, css3

מי תומך בגישה ישירה לאלנטים ב - DOM בלי להפעיל את document.getElementById
24 March 11 01:39 PM | Shlomo | 2 comment(s)

אני מניח שהקוד הבא די ברור < div id ="rightCell"> </ div > < script type ="text/javascript"> var rightCell = document.getElementById( 'rightCell' ); rightCell.appendChild(document.createTextNode( 'Shlomo Goldberg' )); </ script > זה בסך הכול יוסיף ל - div את הטסקט Shlomo Goldberg. אבל מה יקרה אם נריץ את הקוד הבא: < div id ="rightCell"> </ div > < script type ="text/javascript"> rightCell.appendChild...

תגים:DEV, JavaScript, Internet Explorer, html, dom

Working with Microsoft.mshtml in c#
01 February 11 11:35 AM | Shlomo | 7 comment(s)

ניתוח קוד html ב - #C באפליקציית Console Application קבלתי משימה - נתנו לי כתובת דף אינטרנט המציג תוצאות חיפוש לפי פרמטרים, השאילתא מחזירה כ - 86 דפים ובכל דף 10 תוצאות (סך הכול 860 תוצאות), מה שהייתי צריך לעשות זה: 1. לגלוש לאתר מקוד 2. לנתח את התוצאות 3. להוציא אותם לאקסל. לגלוש לאתר מקוד זה מאוד פשוט: private string GetHtml( string url) { WebClient client = new WebClient (); string str = client.DownloadString(url); return str; } להוציא את התוצאות לאקסל, זה גם לא נורא (אני אראה את זה בפוסט עתידי...

תגים:DEV, html, OFFICE