این باکس توسط گروه بیست اسکریپت تهیه شده و در این باکس از jquery و css استفاده شده که زیبایی خاصی به اون میده . به ادامه مطلب برید و سورس باکس تبلیغات رو به رایگان دانلود کنید.
<script src="http://code.jquery.com/jquery.min.js"></script> <script type='text/javascript'> $(document).ready(function(){ // author :www.20script.ir // aka3_ir@yahoo.com $(".close_toolsdl").click(function(){ $(".top_ads_toolsdl").slideToggle(300); $(".arrow_down_toolsdl").delay(300).slideToggle(300); }); $(".arrow_down_toolsdl").click(function(){ $(".arrow_down_toolsdl").slideToggle(300); $(".top_ads_toolsdl").delay(300).slideToggle(300); }); }); </script> <style> .top_ads_toolsdl { width:898px; float:right; margin:0 220px 0 0; background:url(images/top_ads.png) repeat; height:100px; border:1px solid #d0d0d0; transition-property:border, border-radius; transition-duration:1s; -moz-transition-property:border, -moz-border-radius; -moz-transition-duration:1s; -webkit-transition-property:border, -webkit-border-radius; -webkit-transition-duration:1s; -o-transition-property:border, -o-border-radius; -o-transition-duration:1s; -ms-transition-property:border, -ms-border-radius; -ms-transition-duration:1s; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px; } .arrow_down_toolsdl { width:24px; float:right; height:24px; background:url(http://www.20script.ir/wp-content/uploads//ads-arrow.png) no-repeat center #fff; padding:3px; position:absolute; right:230px; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; -o-border-radius-bottomright: 5px; -o-border-radius-bottomleft: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; border:1px solid #d0d0d0; display:none; cursor:pointer } .top_ads_toolsdl:hover { border:1px dashed #7c7a7a; -webkit-border-radius: 5px; -moz-border-radius:10px; -o-border-radius: 10px; -ms-border-radius: 10px; border-radius: 10px; } .top_ads_toolsdl img { float:left; margin:15px 0 0 15px; transition-property:border, border-radius; transition-duration:1s; -moz-transition-property:border, -moz-border-radius; -moz-transition-duration:1s; -webkit-transition-property:border, -webkit-border-radius; -webkit-transition-duration:1s; -o-transition-property:border, -o-border-radius; -o-transition-duration:1s; -ms-transition-property:border, -ms-border-radius; -ms-transition-duration:1s; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px; border-radius: 5px; border:5px solid #d4d4d4; } .top_ads_toolsdl object { float:left; margin:15px 0 0 15px; } .top_ads_toolsdl img:hover { border:5px solid #888; } .top_ads_toolsdl p { float:right; font-family: BYekan, tahoma, Helvetica, sans-serif; font-size:13px; color:#afafaf; text-shadow:1px 1px #fff; margin:30px 25px 0 0 } .top_ads_toolsdl a.order { float:right; font-family: BYekan, tahoma, Helvetica, sans-serif; font-size:12px; color:#afafaf; text-shadow:1px 1px #fff; margin:15px 120px 0 0 } .close_toolsdl { width:35px; height:35px; background:url(http://www.20script.ir/wp-content/uploads//ads-close.jpg) no-repeat; float:right; margin:30px 15px 0 0; cursor: pointer; } </style> <div class="top_ads_toolsdl"> <a href="http://www.20script.ir/" target="_blank"><img src="http://up.20script.ir/up/1393081118631.gif"></a> <div class="close_toolsdl"> </div> <p>تبلیغات هزینه نیست ، بلکه سرمایه گذاری است</p> <a href="http://www.20script.ir/" class="order">جهت سفارش تبلیغات کلیک کنید ...</a> </div> <div class="arrow_down_toolsdl"></div>
- مشکلی دارید؟ جواب خود را در پست فروم بگیرید
- منبع : بیست اسکریپت لطفا رعایت کنید