تبلیغات
تبلیغات متنی
پرچم تشریفات با کیفیت بالا و قیمت ارزان
پرواز از نگاه دکتر ماکان آریا پارسا
دکتر علی پرند فوق تخصص جراحی پلاستیک
تجهیزات و دستگاه های کلینیک زیبایی
محبوبترینها
سررسید تبلیغاتی 1404 چگونه می‌تواند برندینگ کسب‌وکارتان را تقویت کند؟
چگونه با ثبت آگهی رایگان در سایت های نیازمندیها، کسب و کارتان را به دیگران معرفی کنید؟
بهترین لوله برای لوله کشی آب ساختمان
دانلود آهنگ های برتر ایرانی و خارجی 2024
ماندگاری بیشتر محصولات باغ شما با این روش ساده!
بارش‌های سیل‌آسا در راه است! آیا خانه شما آماده است؟
بارش‌های سیل‌آسا در راه است! آیا خانه شما آماده است؟
قیمت انواع دستگاه تصفیه آب خانگی در ایران
نمایش جنگ دینامیت شو در تهران [از بیوگرافی میلاد صالح پور تا خرید بلیط]
9 روش جرم گیری ماشین لباسشویی سامسونگ برای از بین بردن بوی بد
ساندویچ پانل: بهترین گزینه برای ساخت و ساز سریع
صفحه اول
آرشیو مطالب
ورود/عضویت
هواشناسی
قیمت طلا سکه و ارز
قیمت خودرو
مطالب در سایت شما
تبادل لینک
ارتباط با ما
مطالب سایت سرگرمی سبک زندگی سینما و تلویزیون فرهنگ و هنر پزشکی و سلامت اجتماع و خانواده تصویری دین و اندیشه ورزش اقتصادی سیاسی حوادث علم و فناوری سایتهای دانلود گوناگون
مطالب سایت سرگرمی سبک زندگی سینما و تلویزیون فرهنگ و هنر پزشکی و سلامت اجتماع و خانواده تصویری دین و اندیشه ورزش اقتصادی سیاسی حوادث علم و فناوری سایتهای دانلود گوناگون
آمار وبسایت
تعداد کل بازدیدها :
1851381126
نمایشگر ساده “new” با استفاده از CSS
واضح آرشیو وب فارسی:راسخون:
نمایشگر ساده “new” با استفاده از CSS مقدمه: اگر تا حالا یک Message board engine نوشته باشید، ممکن است خواسته باشید که به کاربر به نحوی نشان دهید که اگر پیغام جدیدی از آخرین باری که Login کرده دارد یا نه؟ در کنار آن ممکن است بخواهید یک تصویر “new!” هم نمایش داده شود که کاربر به سرعت متوجه پیغام جدیدش باشد.که معمولاٌ این تصویر هنگامی که پیام خوانده یا جواب داده شده محو می گردد. Background یک تکنیک ساده برای بدست آوردن چنین نتیجه ای این است که هر روزی که جدیتر از روز فعلی است را، فراخوانی کرده و کلمه “new” را به آن اختصاص دهد. زمانی که یک کاربر پیام جدیدش را بخواند، آن پیام برای آن کاربر، از آن پس به عنوان یک پیام جدید شناخته شده نیست، در حالی که آیکن “new” به نمایش دادن خودش ادامه می دهد. ولی در قسمت دیگر قالب، شما می توانید پیغام های را که هر کاربر خوانده، ذخیره و از آنها برای نمایش دادن یک لیست استفاده کنید. هرچند این کار احتیاج با کار زیادی دارد. این همه کار فقط برای نمایش دادن یک “new!” !!!. استفاده از کدها : تکنیکی که در این مقاله بکار برده شده در بین < > قرار دارد. هرچند که این کار 100% دقیق نیست ولی پیاده سازی آن ساده است. این تکنیک از رفتار پیش فرض تگ HTML anchor tag <a> استفاده می کند. کلید این روش در تگی است که از دو pseudo-classes : a:link و a:visited تشکیل شده. به این معنی که این link تا به حال ویزیت نشده و این link اخیراٌ ویزیت شده است ( به ترتیب ). اینها می توانند به صورت مستقل در StyleSheet ها همانگونه که نشان داده شده عمل کنند، (درست در جای که ما یک کلاس عمومی به نام MsgAnchor ساخته ایم )
حال می توانیم از کلاسهای Css روی المان هایمان با استفاده از تگ <a> استفاده کنیم و مرورگر کاربر تصمیم می گیرد که کدام pseudo-classe را انتخاب کند، که آیا کاربر Link را ویزیت کرده یا خیر؟. اینها اطلاعات پایه StyleSheet ها هستند . لم کار در اینجاست که در ساخت Messagelist تتان به چه شکل از مزایای این pseudo-class استفاده می کنید. یک مثال ساده از لیست پیام ها ذکر شده، که کاربر، اول لیست عناوین را مشاهده می کند و می تواند روی هر کدام از آنها کلیک کرده تا پاسخ را ببیند. صفحه اصلی، پیام ها را از پایگاه داده دریافت کرده و به کاربر نشان می دهد. در زیر یک مثال از HTML آمده :
المان <span> که css کلاسش، MsgAnchor است، در تگ Anchor جای دارد. Href برای تگ Anchor شامل تعداد پاسخ ها به این پیام است. <a href= "CSSSampleDetails.html?ID= 2&NumReplies= 2">. حال که کاربر اول لیست را مشاهده می کند، تمام تگهای Anchor، Unvisited (ویزیت نشده) هستند، پس یه این ترتیب از کلاس a:link استفاده خواهد کرد. در صورتی که ما از کلاس msgAnchor که قبلاٌ نمایش داده شده استفاده کنیم این بدین معنی است که متن “new!” به سبز روشن و بدون هیچ آرایشی نمایش داده خواهد شد. سپس کاربر روی یکی از لینکهای پیامها کلیک کرده تا بتواند پاسخ ها (replies) را مشاهده کند. این عمل باعث می شود که Link مربوطه به Visited تبدیل شود و دفعه بعد مرورگر از کلاس a:visited زمانی که صفحه نمایش داده شد، استفاده خواهد کرد. سپس زمانی که کاربر به این صفحه بر میگردد مرورگر از کلاس a:visited که خصوصیت Display:none دارد استفاده خواهد کرد که این عمل باعث می شود آیکن “new!” مخفی شود. موارد خاص : نکته ای که لازم به ذکر است این است که، این تکنیک چندین عیب دارد که در زیر ذکر شده اند، ولی برای یک چاره ساده کارایی دارد. - اگر کاربر History را پاک و از بین ببرد، تمام آیتم ها دوباره”new” می شوند. - مرورگرهای مختلف “visited” را به صورت متفاوتی مشخص می کنند و ممکن است لینکهای visited را Un-do کنند. - اگر یک کاربری به صفحه شما در یک کامپیوتر دیگر نگاه کند، لینکهای visited از آن پیروی نخواهند کرد. مترجم : فرزاد شیرزاد معرفي سايت مرتبط با اين مقاله تصاوير زيبا و مرتبط با اين مقاله
این صفحه را در گوگل محبوب کنید
[ارسال شده از: راسخون]
[مشاهده در: www.rasekhoon.net]
[تعداد بازديد از اين مطلب: 666]
-
گوناگون
پربازدیدترینها