طراحی سایت و پنل Drop downبا Ajax

در طراحی سایت می توانید با بهره گیری از زبان های مختلف امکانات متفاوت را در صفحه وب سایت فراهم نماییم. با افزودن قابلیت های جدید می توانید بر زیبایی طراحی سایت خود بیفزایید و موجب جلب نظر کاربران سایت خود شوید که در نتیجه آن در سئو سایت خود تاثیر مثبتی را شاهد خواهید بود. زبان Ajax  یکی از زبان های پرکاربرد در طراحی سایت می باشد. ممکن است شما در صدد باشید با ایجاد پنل  drop downو با بهره گیری از زبان  Ajaxقابلیت زیبایی را در طراحی وب سایت خود لحاظ نمایید. با کلیک بر روی پنل می توانید پیغام پنهانی را به کاربران وب سایت خود نمایش دهید. در اینجا قصد داریم کد لازم برای ایجاد این قابلیت در طراحی سایت را به نمایش بگذاریم.

<script type="text/j-avascript" src="/demo/jquery-1.2.2.pack.js"></script>

<style type="text/css">

#dropdownpanel{ /*Outermost Panel DIV*/

position: absolute;

width: 100%;

left: 0;

top: 0;

visibility:hidden;

}

#dropdownpanel .contentdiv{ /*Div containing Ajax content*/

background: black;

color: white;

padding: 10px;

}

#dropdownpanel .control{ /*Div containing panel button*/

border-top: 5px solid black;

color: white;

font-weight: bold;

text-align: center;

background: transparent url("panel.gif") center center no-repeat; /*change panel.gif to your own if desired*/

padding-bottom: 3px; /* 21px + 3px should equal height of "panel.gif" */

height: 21px; /* 21px + 3 px should equal height of "panel.gif" */

line-height: 21px; /* 21px + 3px should equal height of "panel.gif" */

}

</style>

<script type="text/j-avascript" src="/demo/jkpanel.js">

/***********************************************

* Drop Down Panel script- by JavaScript Kit (www.javascriptkit.com)

* This notice must stay intact for usage

* Visit JavaScript Kit at http://www.javascriptkit.com/ for this script and 100s more

***********************************************/

</script>

با آسانی با درج کدهای بالا می توانید قابلیت پنل پنهانی را در طراحی سایت خود درج نمایید و با جلب توجه خاص کاربر به طراحی وب سایت خود در سئو وب سایت خود تاثیر مثبتی را برجا گذاشته باشید.