کد html بخش دوم

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

لودینگی که امروز بهتون معرفی میکنم به این شیوه کار میکنه که هنگامی که آدرس صفحه رو میزنید یه مستطیل مثل زیر در بالای صفحه میاد و هی پر میکنه تا صفحه کاملا لود شه و بعد از لود شدن کاملا از روی صفحه محو میشه . ( مثل مال خودم )

صفحه در حال بارگذاری است!
لطفا کمی صبر کنید ...

خوب برای این کار ابتدا کد زیر رو در ابتدای قالب خوب بعد از تگ <Body> قرار دهید :

<script>var DHTML = (document.getElementById || document.all || document.layers); function ap_getObj(name) { if (document.getElementById) { return document.getElementById(name).style; } else if (document.all) { return document.all[name].style; } else if (document.layers) { return document.layers[name]; } } function ap_showWaitMessage(div,flag) { if (!DHTML) return; var x = ap_getObj(div); x.visibility = (flag) ? 'visible':'hidden' ;if(! document.getElementById) if(document.layers) x.left=280/2; return true; }</script> <div id="waitDiv" style="border: 1px dotted ; POSITION:absolute;TOP: 90;RIGHT:400;TEXT-ALIGN:center; visibility:hidden; width:211; background-color:#b3c3e4" padding-left:4px; padding-right:4px; padding-top:1px; padding-bottom:1px> <p dir="rtl" style="margin-top: 5; margin-bottom:5"> <font color="#0000FF" face="Tahoma" style="font-size: 8pt">صفحه در حال بارگذاری است!<br>لطفا کمی صبر کنید...</font></p> <p dir="rtl" style="margin-top: 0"><font face="Tahoma" style="font-size: 8pt"> <img alt="Please wait ..." src="http://www.iroweb.com/Photo/90a.gif" width="150" height="13" border="0"><br> <span style="visibility:''"> <a target="_blank" href="http://www.iroweb.com" style="text-decoration: none">Loading by : iroweb.com</a></span></font></p> </div> <SCRIPT> ap_showWaitMessage('waitDiv', 1)</SCRIPT>

مثل زیر :

<body>
<script>var DHTML = (document.getElementById || document.all || document.layers); function ap_getObj(name) { if (document.getElementById) { return document.getElementById(name).style; } else if (document.all) { return document.all[name].style; } else if (document.layers) { return document.layers[name]; } } function a ....

.....

بعد از اینکه کد بالا رو جایی که گفتم گذاشتید نوبت به گذاشتن کدی می رسه که بعد از لود صفحه ، لودینگ رو حذف کنه . لذا باید این کد رو در آخر کد قالبتون و قبل از تگ <html/> قرار دهید :

<SCRIPT> ap_showWaitMessage('waitDiv', 0) </SCRIPT>

مثل زیر :

<SCRIPT>ap_showWaitMessage('waitDiv', 0)</SCRIPT>
</html>

خوب دیگه کار تموم میشه . ولی چون ممکنه بعضی ها از شکل نوار لودینگ خوششون نیاد من چند تا شکل براتون زیر میزارم که هرکدوم رو دوست داشتید استفاده کنید :

ردیف	شکل	آدرس
1		http://www.iroweb.com/Photo/90b.gif
2		http://www.iroweb.com/Photo/90c.gif
3		http://www.iroweb.com/Photo/90d.gif
4		http://www.iroweb.com/Photo/90e.gif
5		http://www.iroweb.com/Photo/90f.gif
6		http://www.iroweb.com/Photo/90g.gif
7		http://www.iroweb.com/Photo/90h.gif
8		http://www.iroweb.com/Photo/90i.gif
9		http://www.iroweb.com/Photo/90j.gif
10		http://www.iroweb.com/Photo/90k.gif

افکت گذاری رو ورود و خروج از صفحات وب ( کدهای جاوا اسکریپت )

سلام . نمیدونم که تا حالا به نحوه ورود و خروج از این سایت دقت کردید . ( در سری جدید ) ؟ اگر کمی دقت کنید می بینید که با یک افکت جالبی میاد و میره . چند نفر از دوستان طراح که اینو دیده بودند براشون جلب توجه کرده بود و تقاضا داشتند که این آموزشو براشون بزارم . خوب ما هم که بخیل نیستیم ، لذا این آموزشو براشون آماده کردم :

کدهای اصلی : در اصل این کد های افکت دهنده از نوع تگ های Meta می باشند که یک خط بیشتر نیستند .

<Meta http-equiv="Site-Enter"> برای زمان ورود از صفحه

زیر کدهای افکت دهنده : با استفاده از این زیر کدها میتوان افکت آمدن و خروج از صفحه رو مشخص کرد .

افکت به صورت باکس :

افکت به صورت در هم رفتن دو صفحه به صورت بسیار زیبا

ماکزیموم شدن خودکار صفحه ( کدهای جاوا اسکریپت )

یکی از دوستان تقاضا کد ماکزیموم کردن خودکار صفحه رو داده بودند . خوب بنا به قولی که داده بودم این مطلب رو براشون آماده کردم :

خیلی از قالب ها هستند که برای حالت ماکزیموم صفحه طراحی شده اند و اگر صفحه کوچکتر باشد اون طراحی جلوه خودشو از دست میده . لذا با استفاده از این کد می توانید به مرورگر فرمان دهید که خودکار صفحه رو ماکزیموم کند :

<script language="JavaScript1.2">top.window.moveTo(0,0);if (document.all) {top.window.resizeTo(screen.availWidth,screen.availHeight);}else if (document.layers||document.getElementById) {if (top.window.outerHeight<screen.availHeight||top.window.outerWidth<screen.availWidth){top.window.outerHeight = screen.availHeight;top.window.outerWidth = screen.availWidth;}}</script>