Не нравятся результаты поиска? Попробуйте другой поиск!
DLE FAQ » Все вопросы » Стили (CSS) » Помощь с pagination'om

Помощь с pagination'om


     01.07.2014    jQuery hover    Стили (CSS), jQuery    3768

вопрос
Есть код пагинатора html:

    <div class="pagination">
        <div class="pagination-form">
            <div class="pagination-previous"><</div>
            <div class="pagination-number">1</div>
            <div class="pagination-number">...</div>
            <div class="pagination-number">3</div>
            <div class="pagination-next">></div>
        </div>
    </div>

Код css:

/* И сам блок
.pagination {
    width: 100%;
    height: 50px;
    float: left;
    background: rgba(255, 255, 255, 0.25);
    box-shadow: 0 -1px 0 rgba(0,0,0, 0.5);
}
/* Основная форма
.pagination-form {
    width: 320px;
    margin: 10px auto;
    height: 29px;
    background: #fff;
}
/* Кнопка назад
.pagination-previous {
    float: left;
    width: 32px;
    height: 29px;
    background: #e67b09;
    text-align: center;
    padding-top: 5px;
    color: white;
    font-size: 14px;
}
/* кнопка далее
.pagination-next {
    float: right;
    height: 29px;
    width: 32px;
    background: #e67b09;
    text-align: center;
    padding-top: 5px;
    color: white;
    font-size: 14px;
}
/* Набор стилей в pagination'e
.pagination-number {
    float: left;
    width: 32px;
    height: 29px;
    text-align: center;
    padding-top: 5px;
    color: #8e8e8e;
    border-right: 1px solid #e6e6e6;
}
/* затемняет бордер и текст
.pagination-number:hover {
    border-color: #c0c0c0;
    color: #c0c0c0;
}
/* Настройки для стрелочек
.pagination-number:before, .pagination-number:after {
    content: "";
    position: absolute;
}
/* Это если что стрелочки
.paginator-top:before, .paginator-top:after {
    border-left: 5px solid #fff;
    border-top: 5px solid #fff;
    border-right: 5px solid #fff;
    top: -5px;
    color: red;
}


Пытался делать через jquery с таким кодом,но увы не получалось никак

$(document).ready(function(){
    $("paginator-number").hover(
        function () {
            $(this).addClass("paginator-top");
        });
});


Помогите, выложите код работающий, а то в печали... :(

Ответил: aqps


Нашел ошибку свою, не так прописывал код...

1 комментарий

2009bes
Юзер

2009bes - 27 сентября 2016 01:58 -

вы бы отписались как сделали,может пригодится кому

Чтобы комментировать - войдите или зарегистрируйтесь на сайте

Похожие вопросы

наверх