دوست دارید بدونید پارسال همین موقع یا چند سال پیش همین موقع خودتون یا دوستاتون چه پُستی تو فیسبوک ارسال کردید؟

به نظر من جالبه یا حداقل واسه من جالب بود.

قابلیت جدید فیسبوک بنام “امروز در تاریخ” به تازگی راه‌اندازی شده و می‌توانید به کمک آن ببینید که سال گذشته در چنین روزی چه اتفاقاتی را در فیسبوک شاهد بوده‌اید.

https://www.facebook.com/todayinhistory

۲۶ آبان ۱۳۹۲

دیدید تو برخی سایتها قسمت های مختلف صفحه پس زمینه متفاوت داره؟ که وقتی صفحه رو اسکرول میکنید، کم کم پس زمینه اون قسمت میره بالا و پس زمینه قسمت بعد میاد، امروز میخوام اینو بهتون آموزش بدم، یک طرح اسکرول با عکس پس زمینه ثابت با استفاده از قالبلیت background-attachment: fixed و یک قسمت ناوبری  ( navigation ) . صفحه همواره به بخش انتخاب شده حرکت خواهد کرد.

قسمت HTML

<div id="cbp-fbscroller" class="cbp-fbscroller">
    <nav>
        <a href="#fbsection1" class="cbp-fbcurrent">Section 1</a>
        <a href="#fbsection2">Section 2</a>
        <a href="#fbsection3">Section 3</a>
        <a href="#fbsection4">Section 4</a>
        <a href="#fbsection5">Section 5</a>
    </nav>
    <section id="fbsection1"></section>
    <section id="fbsection2"></section>
    <section id="fbsection3"></section>
    <section id="fbsection4"></section>
    <section id="fbsection5"></section>
</div>

به ادامه مطلب بروید..

ادامه

۳ خرداد ۱۳۹۲

فیسبوک که هستید؟ چه سوالیه 😀 الان دیگه هر کسی یه اکانت تو فیسبوک داره دیگه.
اگه دقت کرده باشید تو صفحه پروفایل خودتون، مطالب با توجه به تاریخ ارسال از بالا به پایین منتشر میشن، به این قسمت میگن تایم لاین!

دوست دارید یه نمونه تایم لاین تو وبلاگ یا سایت خودتون داشته باشید ؟

امروز یک نمونه از این تایم لاین را برای شما آموزش میدم.
این یک نمونه از تایم لاین واکنش گرا با رنگ متناوب برای هر جدول هست، آیکونهای به کار رفته با استفاده از فونت fontawesome می باشد.
خوب بریم سراغ فایل ها تا ببینیم که داخل قسمت html و css چه خبره 🙂

مشاهده دموی اسکریپتدریافت اسکریپت

قسمت HTML

				<ul class="cbp_tmtimeline">
					<li>
						<time class="cbp_tmtime" datetime="2013-04-10 18:30"><span>4/10/13</span> <span>18:30</span></time>
						<div class="cbp_tmicon cbp_tmicon-phone"></div>
						<div class="cbp_tmlabel">
							<h2>عنوان پست</h2>
							<p>لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت</p>
						</div>
					</li>
					<li>
						<time class="cbp_tmtime" datetime="2013-04-11T12:04"><span>4/11/13</span> <span>12:04</span></time>
						<div class="cbp_tmicon cbp_tmicon-screen"></div>
						<div class="cbp_tmlabel">
							<h2>عنوان پست</h2>
							<p>لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت</p>
						</div>
					</li>
					<li>
						<time class="cbp_tmtime" datetime="2013-04-13 05:36"><span>4/13/13</span> <span>05:36</span></time>
						<div class="cbp_tmicon cbp_tmicon-mail"></div>
						<div class="cbp_tmlabel">
							<h2>عنوان پست</h2>
							<p>لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت</p>
						</div>
					</li>
					<li>
						<time class="cbp_tmtime" datetime="2013-04-15 13:15"><span>4/15/13</span> <span>13:15</span></time>
						<div class="cbp_tmicon cbp_tmicon-phone"></div>
						<div class="cbp_tmlabel">
							<h2>عنوان پست</h2>
							<p>لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت</p>
						</div>
					</li>
					<li>
						<time class="cbp_tmtime" datetime="2013-04-16 21:30"><span>4/16/13</span> <span>21:30</span></time>
						<div class="cbp_tmicon cbp_tmicon-earth"></div>
						<div class="cbp_tmlabel">
							<h2>عنوان پست</h2>
							<p>لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت</p>
						</div>
					</li>
					<li>
						<time class="cbp_tmtime" datetime="2013-04-17 12:11"><span>4/17/13</span> <span>12:11</span></time>
						<div class="cbp_tmicon cbp_tmicon-screen"></div>
						<div class="cbp_tmlabel">
							<h2>عنوان پست</h2>
							<p>لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت</p>
						</div>
					</li>
					<li>
						<time class="cbp_tmtime" datetime="2013-04-18 09:56"><span>4/18/13</span> <span>09:56</span></time>
						<div class="cbp_tmicon cbp_tmicon-phone"></div>
						<div class="cbp_tmlabel">
							<h2>عنوان پست</h2>
							<p>لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت</p>
						</div>
					</li>
				</ul>

قسمت css را در ادامه مطلب ببینید..

ادامه

۱۸ اردیبهشت ۱۳۹۲

سلام دوستان، از این به بعد میخوام مطالب آموزشی رو ترجمه کنم و به شما یاد بدم، پس امروز اولین پست را ارسال می کنم، من تو ترجمه زیاد وارد نیستم، ولی سعی کردم خوب و گیرا ترجمه کنم، اگه یکم ترجمه رسمی بود به دل نگیرید، به مرور زمان من سعی می کنم بهتر ترجمه کنم. خوب بریم سراغ آموزش:

امروز میخواهم چگونگی ساخت افکت های سه بعدی هیجان انگیز را با استفاده از css3 و jQuery نشان بدهم. این ایده الهام گرفت شده از افکت حرکتی است که شما می توانید در صفحه Google SketchUp Showcase پیدا کنید. ما یک ساختار با jquery می سازیم که به ما اجازه میدهد ، وقتی به روی عکس برویم ، خم یا تا شود. برای این افکت ما از تبدیل css سه بعدی استفاده میکنیم.
پس این موضوع را ذکر کنم که این افکت فقط در مرورگرهای جدید کاربرد دارد و در اینترنت اکسپلورر ( حتی نسخه ۹ ) اجرا نمی شود.
آموزش در ادامه مطلب..
ادامه

۱ تیر ۱۳۹۱
بالا