رفتن به مطلب
سیدرضا بازیار

درخواست کد باکس موزیک

پست های پیشنهاد شده

من میخوام یه کد باکس موزیک بسازم که وقتی لینک موزیک رو توی اون بزارم, پخش آنلاین موزیک + لینک دانلود + حجم + فرمت + کد پخش آنلاین و... رو نشون بده

لطفا راهنمایی کنید

به اشتراک گذاری این ارسال


لینک به ارسال

لینک باز نمیشه

اگه ممکنه آموزش رو برام بزارید همین جا

من قصد دارم یه چیز مانند کد زیر توی سایتم باشه


<style type="text/css">
.dl-p2g a, .dl-p2g li{
-webkit-transition:all 0.5s ease-in;
-moz-transition:all 0.5s ease-in;
-o-transition:all 0.5s ease-in;
transition:all 0.5s ease-in;
}
div.dl-p2g{
margin:0;
padding:0;
background-color: #40C9FF;

box-shadow:0 0 0px 2px #40C9FF;
width:400px;
display:block;
margin:0px;
padding:0;
-webkit-border-top-right-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
-moz-border-radius-topright: 5px;
-moz-border-radius-bottomleft: 5px;
border-top-right-radius: 5px;
border-bottom-left-radius: 5px;
overflow:hidden;
font-family: "B Yekan",Arial, tahoma, Sans-Serif;
text-shadow:1px 1px 0px #fff;
-webkit-transition:all 0.5s ease-in;
-moz-transition:all 0.5s ease-in;
-o-transition:all 0.5s ease-in;
transition:all 0.5s ease-in;
}
div.dl-p2g:hover{
margin:0;
padding:0;
background-color: #009DFF;

box-shadow:0 0 0px 2px #009DFF;
width:400px;
display:block;
margin:3px;
padding:0;
-webkit-border-top-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-moz-border-radius-topright: 10px;
-moz-border-radius-bottomleft: 10px;
border-top-right-radius: 10px;
border-bottom-left-radius: 10px;
-webkit-border-top-left-radius: 10px;
-webkit-border-bottom-right-radius: 10px;
-moz-border-radius-topleft: 10px;
-moz-border-radius-bottomright: 10px;
border-top-left-radius: 10px;
border-bottom-right-radius: 10px;
overflow:hidden;
font-family: "B Yekan",Arial, tahoma, Sans-Serif;
text-shadow:1px 1px 0px #fff;
-webkit-transition:all 0.5s ease-in;
-moz-transition:all 0.5s ease-in;
-o-transition:all 0.5s ease-in;
transition:all 0.5s ease-in;
}
div.dl-p2g-bg{
width:400px;
margin:0;
padding:0;
box-shadow:0 0 25px 0px #00FFFF inset;
-webkit-border-top-right-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
-moz-border-radius-topright: 5px;
-moz-border-radius-bottomleft: 5px;
border-top-right-radius: 5px;
border-bottom-left-radius: 5px;
overflow:hidden;
display:block;
-webkit-transition:all 0.5s ease-in;
-moz-transition:all 0.5s ease-in;
-o-transition:all 0.5s ease-in;
transition:all 0.5s ease-in;
}
div.dl-p2g-bg:hover{
width:400px;
margin:0;
padding:0;
box-shadow:0 0 25px 0px #fff inset;
-webkit-border-top-right-radius: 0px;
-webkit-border-bottom-left-radius: 0px;
-moz-border-radius-topright: 0px;
-moz-border-radius-bottomleft: 0px;
border-top-right-radius: 0px;
border-bottom-left-radius: 0px;
-webkit-border-top-left-radius: 10px;
-webkit-border-bottom-right-radius: 10px;
-moz-border-radius-topleft: 10px;
-moz-border-radius-bottomright: 10px;
border-top-left-radius: 10px;
border-bottom-right-radius: 10px;
overflow:hidden;
display:block;
-webkit-transition:all 0.5s ease-in;
-moz-transition:all 0.5s ease-in;
-o-transition:all 0.5s ease-in;
transition:all 0.5s ease-in;
}
.dl-p2g p:first-child{
font-size:18px;
padding:0 33px 0 150px;
margin:8px;
box-shadow:0 0 0px 2px #fff;
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
-webkit-transition:all 0.5s ease-in;
-moz-transition:all 0.5s ease-in;
-o-transition:all 0.5s ease-in;
transition:all 0.5s ease-in;
}
.dl-p2g p:first-child:hover{
font-size:18px;
padding:0 20 0 33px;
margin:8px;
box-shadow:0 0 0px 2px #fff;
border-radius:5px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
-webkit-transition:all 0.5s ease-in;
-moz-transition:all 0.5s ease-in;
-o-transition:all 0.5s ease-in;
transition:all 0.5s ease-in;
}
.dl-p2g ul{
list-style:none;
padding:0;
margin:0;
}
.dl-p2g ul li{
margin:8px;
padding:2px 35px 2px 2px;
background-color: #fff;
box-shadow:0 0 0px 1px #fff;
max-width:250px;
background-position:right top;
background-repeat:no-repeat;
font-size:18px;
height:30px;
border-radius:2px;
-moz-border-radius:2px;
-webkit-border-radius:2px;
}
.dl-p2g ul li:hover{
margin:8px;
padding:2px 5px 2px 2px;
background-color: #59DE37;
box-shadow:0 0 0px 1px #59DE37;
max-width:320px;
background-position: right top;
background-repeat:no-repeat;
font-size:18px;
height:30px;
border-radius:2px;
-moz-border-radius:2px;
-webkit-border-radius:2px;
}
.dl-p2g ul li.dl{
background-image:url('http://icons.iconarchive.com/icons/martz90/circle-addon2/32/downloads-icon.png');
}
.dl-p2g ul li.dl2{
background-image:url('http://icons.iconarchive.com/icons/martz90/circle-addon2/32/downloads-icon.png')
}
.dl-p2g ul li.hajm{
background-image:url('http://icons.iconarchive.com/icons/martz90/circle-addon2/32/antivirus-universal-icon.png');
}
.dl-p2g ul li.pas{
background-image:url('http://icons.iconarchive.com/icons/martz90/circle-addon2/32/xchat-icon.png');
}
.dl-p2g ul li.manba{
background-image:url('http://icons.iconarchive.com/icons/martz90/circle-addon2/32/browser-icon.png');
}
.dl-p2g ul li a{
color:#000;
text-decoration:none;
border:0;
}
.dl-p2g ul li a:hover{
color:#0000FF;
text-shadow:0px 0px 2px #000;
}
</style>
<div class="dl-p2g"><div class="dl-p2g-bg"><p>لینک های دانلود</p>
<ul>
<li class="dl"><a href="/">دانلود از لینک مستقیم</a></li>
<li class="hajm">حجم : 1 مگابایت</li>
<li class="pas">رمز : www.modanisa.ir</li>
<li class="manba">منبع : <a href="/">مدانیسا</a></li>
</ul></div></div>

پایین سایتم 4 تا کادر واسه این 4 تا بخش ایجاد بشه و با کامل شدن 4 تا کارد, یه کد باکس قرار بگیره

همچنین بتونم ده ها کد باکس رو قرار بدم

به اشتراک گذاری این ارسال


لینک به ارسال

به گفتگو بپیوندید

هم اکنون می توانید مطلب خود را ارسال نمایید و بعداً ثبت نام کنید. اگر حساب کاربری دارید، برای ارسال با حساب کاربری خود اکنون وارد شوید .

مهمان
ارسال پاسخ به این موضوع ...

×   شما در حال چسباندن محتوایی با قالب بندی هستید.   حذف قالب بندی

  تنها استفاده از 75 اموجی مجاز می باشد.

×   لینک شما به صورت اتوماتیک جای گذاری شد.   نمایش به صورت لینک

×   محتوای قبلی شما بازگردانی شد.   پاک کردن محتوای ویرایشگر

×   شما مستقیما نمی توانید تصویر خود را قرار دهید. یا آن را اینجا بارگذاری کنید یا از یک URL قرار دهید.


×
×
  • اضافه کردن...