اضافة قائمة علوية منسدلة أعلى الهيدر مع امكانية وضع الادوات بها

مميزات الاضافة 

♦ المعاينة الحية المباشرة للاضافة ♦

شرح التركيب

<div class='msgall'>
<div id='msg1' style='display: none;'>
<!-- add your widgets  -->
كود الاضافة الأولى
كود الاضافة الثانية
<!-- add your widgets  --></div>
<div id='msg12'>
<b class='msg3' id='msg3' style='display: block;'><i class='icon-angle-down'/></b>
<b class='msg2' id='msg2' style='display: none;'><i class='icon-angle-up'/></b>
</div>
</div>
<script>$(document).ready(function() {
$(&quot;#msg3&quot;).click(function(){
$(&quot;div#msg1&quot;).slideDown(&quot;slow&quot;);}); $(&quot;#msg2&quot;).click(function(){
$(&quot;div#msg1&quot;).slideUp(&quot;slow&quot;); }); $(&quot;#msg12 b&quot;).click(function () {
$(&quot;#msg12 b&quot;).toggle();
}); });</script>
<style>.msgall{position:fixed;top:0;width:100%;z-index:9999;}.msgall{border-top:3px solid #E9931A;}#msg1{display:none;background:none repeat scroll 0 0 #E9931A;text-align:center;}#msg1{display:none;}.msg3,.msg2{background:none repeat scroll 0 0 #E9931A;cursor:pointer;font-size:30px;padding:8px;position:absolute;right:24px;color:#A14B00;z-index:999999;border-radius:0 0 5px 30px;-webkit-box-shadow:0px -5px 5px #B8761A inset;box-shadow:0px -5px 5px #B8761A inset;}[class^=&quot;icon-&quot;],[class*=&quot; icon-&quot;]{font-family:tahoma;font-weight:normal;font-style:normal;text-decoration:inherit;-webkit-font-smoothing:antialiased;}[class^=&quot;icon-&quot;],[class*=&quot; icon-&quot;]{display:inline;width:auto;height:auto;line-height:normal;vertical-align:baseline;background-image:none;background-position:0% 0%;background-repeat:repeat;margin-top:0;}[class^=&quot;icon-&quot;],[class*=&quot; icon-&quot;]{display:inline;width:auto;height:auto;line-height:normal;vertical-align:baseline;background-image:none;background-position:0% 0%;background-repeat:repeat;margin-top:0;}.icon-angle-down:before{content:&quot;&quot;;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhCRai5l0SBLShpPdtsXuIQC6J3fuxJQKEqelKXdHecNk05dwaR1L2cSs-4JvGsgF5xKDWl14NVcgS4_wt0jQK2Dq5HeUwpiNvqkz9MpeknPh5rjNLJpGRYstUwllWnb2zPWxsy5HxJGaaJ/s1600/9596.png) no-repeat;padding:10px;}[class^=&quot;icon-&quot;]:before,[class*=&quot; icon-&quot;]:before{text-decoration:inherit;display:inline-block;speak:none;}.icon-angle-up:before{content:&quot;&quot;;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDAoKev5spCPfgs0rqq2kaK32fxHQ5PZ8Tk8mW4hTYEch52rqdC_g5AF7nw6rgbqhyb9dGjHrKB3AaHRyg7NiqszGqvAZfCVpbwAL_HmT9gfpTDRJD4BBf_PCW7KxnsUSUBEJ90KtXM4wl/s1600/2552.png) no-repeat;padding:10px;}</style>

√ فى انتظار تعليقاتكم المشجعة على تقديم المزيد لخدمتكم √