سایه دار کردن عکس های meta slider

[Detroit-City 9]

سلام

یک کد میخاستم تا فقط عکس های اسلایدر meta slider دورش سایه دار بشه .

از افزونه meta slider استفاده میکنم.

[علی زینلی 2114]

به فایل .css افزونه مراجعه کن و برای img ها استایل بده.

اگه نیاز به توضیحات بیشتری بود بگو تا بیشتر توضیح بدم. (اگر نیاز بود که کد آماده رو بهت بدیم لطفاً آدرس سایت رو هم بذار)

ویرایش شده آذر 93 توسط علی زینلی

[Detroit-City 9]

ممنون پیدا کردم.

ولی کد هایی که تو اینترنت برای سایه دار کردن هست, خیلی جالب نیست. میخوام سایه اسلایدر مثل این سایت باشه (اسلایدر من هم در این اندازه هست) دور تا درور اسلایدر این سایه باشه لطفا.

کد css - اسلایدر من

.rslides {
    position: relative;
    list-style: none;
    overflow: hidden;
    width: 100%;
    padding: 0;
    margin: 0 !important;
}
.rslides li {
    -webkit-backface-visibility: hidden;
    position: absolute;
    display: none;
    width: 100%;
    left: 0;
    top: 0;
}
.rslides li:first-child {
    position: relative;
    display: block;
    float: left;
}
.rslides img {
    display: block;
    height: auto;
    float: left;
    width: 100%;
    border: 0;
}
/** metaslider custom styles **/
.rslides_tabs {
    margin: 0;
    padding: 7px 0 !important;
    background: #333;
    font-size: 18px;
    list-style: none;
    padding: 10px 0;
    text-align: center;
    width: 100%;
}
.rslides_tabs li {
    margin: 0;
    padding: 0;
    display: inline-block;
    float: none;
    margin-right: 1px;
    list-style-type: none;
}
.rslides_tabs a {
    text-decoration: none;
    width: auto;
    line-height: 20px;
    padding: 9px 20px;
    height: auto;
    background: transparent;
    display: inline;
    color: white;
}
.rslides_tabs a:hover {
    border: 0;
    color: white;
}
.rslides_tabs li:first-child {
    margin-left: 0;
}
.rslides_tabs .rslides_here a {
    background: rgba(255,255,255,.1);
    color: #fff;
    font-weight: bold;
}
.rslides_nav {
    background-color: #000000;
    color: #FFFFFF;
    padding: 10px;
    position: absolute;
    top: 50%;
    z-index: 9;
    cursor: pointer;
    font-weight: bold;
    margin-top: -15px;
    opacity: 0.7;
}
.rslides_nav.prev {
    left: 0px;
    text-decoration: none;
}
.rslides_nav.next {
    right: 0px;
    text-decoration: none;
}
.rslides li,
.rslides .rslides_tabs {
    border: 0;
    border-top: 0;
    border-right: 0;
    border-bottom: 0;
    border-left: 0;
    margin: 0;
    margin-top: 0;
    margin-right: 0;
    margin-bottom: 0;
    margin-left: 0;
    list-style-type: none;
}

[Detroit-City 9]

یکی لطف میکنه این کد سایدارکردن دور عکس های اسلایدر را برای من بنویسه؟

[themento 348]

سلام اینو بزار تو فایل style.css:

.metaslider ul li img {
-webkit-box-shadow: 0 6px 12px #000;
-moz-box-shadow: 0 6px 12px #000;
box-shadow: 0 6px 12px #000;
}

[Detroit-City 9]

سلام-ممنون

ولی کار نکرد.

درست هست؟

الان از تم R. Slides اسلایدر meta slider استفاده میکنم - کد css ش در پایین هست

/*! http://responsiveslides.com v1.53 by @viljamis */
.rslides {
    position: relative;
    list-style: none;
    overflow: hidden;
    width: 100%;
    padding: 0;
    margin: 0 !important;
}
.rslides li {
    -webkit-backface-visibility: hidden;
    position: absolute;
    display: none;
    width: 100%;
    left: 0;
    top: 0;
}
.rslides li:first-child {
    position: relative;
    display: block;
    float: left;
}
.rslides img {
    display: block;
    height: auto;
    float: left;
    width: 100%;
    border: 0;
}
/** metaslider custom styles **/
.rslides_tabs {
    margin: 0;
    padding: 7px 0 !important;
    background: #333;
    font-size: 18px;
    list-style: none;
    padding: 10px 0;
    text-align: center;
    width: 100%;
}
.rslides_tabs li {
    margin: 0;
    padding: 0;
    display: inline-block;
    float: none;
    margin-right: 1px;
    list-style-type: none;
}
.rslides_tabs a {
    text-decoration: none;
    width: auto;
    line-height: 20px;
    padding: 9px 20px;
    height: auto;
    background: transparent;
    display: inline;
    color: white;
}
.rslides_tabs a:hover {
    border: 0;
    color: white;
}
.rslides_tabs li:first-child {
    margin-left: 0;
}
.rslides_tabs .rslides_here a {
    background: rgba(255,255,255,.1);
    color: #fff;
    font-weight: bold;
}
.rslides_nav {
    background-color: #000000;
    color: #FFFFFF;
    padding: 10px;
    position: absolute;
    top: 50%;
    z-index: 9;
    cursor: pointer;
    font-weight: bold;
    margin-top: -15px;
    opacity: 0.7;
}
.rslides_nav.prev {
    left: 0px;
    text-decoration: none;
}
.rslides_nav.next {
    right: 0px;
    text-decoration: none;
}
.rslides li,
.rslides .rslides_tabs {
    border: 0;
    border-top: 0;
    border-right: 0;
    border-bottom: 0;
    border-left: 0;
    margin: 0;
    margin-top: 0;
    margin-right: 0;
    margin-bottom: 0;
    margin-left: 0;
    list-style-type: none;
}

ویرایش شده آذر 93 توسط Detroit-City

[themento 348]

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

.rslides li img {
-webkit-box-shadow: 0 6px 12px #000;
-moz-box-shadow: 0 6px 12px #000;
box-shadow: 0 6px 12px #000;
}