X
تبلیغات
رایتل

کدهای حرفه ای وبلاگ و سایت

کدهای Css3 , JavaScript, PHP و HTML

ساخت یک کرکره نمایش مطلب (متحرک)

روش ساخت صفحه نمایش متن با افکت کرکره با استفاده از css3 و JavaScript
با کلیک بر روی گزینه ها ابتدا تفاوت های موجود را مشاهده نمایید 

به ادامه مطلب مراجعه فرمائید


در حالت css با قرار گرفتن موس روی فضای کرکره متن مشخص می شود ولی در حالت CSS3 کرکره به سمت پایین حرکت می کند و در حالنت Javascript این اتفاق پس از کلیک نمودن بر روی حلقه زخ می دهد


تفاوت بین کدهای CSS و CSS3

css:

table #ctd2 {height:5px;
overflow:hidden;
color:#ffffff;}
table:hover #ctd2 {color:#000000;
height:120px;}

CSS3:
table #ctd2 {height:5px;
overflow:hidden;
color:#ffffff;
-moz-transition: all 3s ease-out;
-o-transition: all 3s ease-out;
-webkit-transition: all 3s ease-out;
transition: all 3s ease-out;
}
table:hover #ctd2 {color:#000000;
height:120px;}

مرحله اول
ابتدا پوشه زیپ شده image را دانلود نموده (راست کلیک و save as) و محتویات آنرا پس از خارج نمودن از حالت زیپ  بر روی یک هاست آپلود نمایید

مرحله دوم
کدهای زیر را عینا در بین تگهای  <head> و </head> قرار دهید برای راحتی در داخل کادر راست کلیک و سلکت آل نمایید

توجه در صورتی که احساس می کنید به کارایی کد جاوا اسکریپت نیازی ندارید آنرا از کد بالا حذف و در ازایش کد زیر را در قسمت Style اضافه نمایید:


مرحله سوم
کد زیر را در محل مناسب در بین تگ های <body> و </body> قرار دهید

تاریخ ارسال: سه‌شنبه 6 اردیبهشت 1390 ساعت 15:43 | نویسنده: ایمان فـخــار | چاپ مطلب
نظرات (4)
پنج‌شنبه 16 تیر 1390 23:05
حامد
امتیاز: 0 0
لینک نظر
کارت فوق العاده است
خیلی بدرد وبلاگم می خورد
بخطر گذاشتن این کد ها ازت ممنونم
پاسخ:
مخلص
چهارشنبه 10 اسفند 1390 01:46
سراج
امتیاز: 0 0
لینک نظر
سلام از این میشه در وبلاگ هم استفاده کرد
لطفا بیا به وبلاگم و پاسخ بده
منتظرم
سه‌شنبه 22 فروردین 1391 15:40
mehrdad
امتیاز: 0 0
لینک نظر
<marquee loop="infinite">متن مورد نظر خود را اینجا بنویسید</marquee>
یکشنبه 11 فروردین 1392 13:00
amir
امتیاز: 0 0
لینک نظر
بهترن وبی که تا حالا دیدم .....ممنون
برای نمایش آواتار خود در این وبلاگ در سایت Gravatar.com ثبت نام کنید. (راهنما)
نام :
پست الکترونیک :
وب/وبلاگ :
ایمیل شما بعد از ثبت نمایش داده نخواهد شد