Blog Post Sticky Pagination
/************** HTML **********************/
/******************************* CSS ********************************/
.avia-post-nav {
position: fixed;
height: 110px;
top: 50%;
background: rgba(0,0,0,0.1);
color: #fff !important;
text-decoration: none !important;
margin-top: -55px;
padding: 15px;
text-decoration: none;
z-index: 999999;
-webkit-transform: translate3d(0,0,0);
-moz-transition: all 0.3s ease-out;
-webkit-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
.avia-post-next span.entry-title {
padding: 0 20px 0 0;
}
.avia-post-nav .label {
position: absolute;
top: 50%;
height: 22px;
line-height: 22px;
margin-top: -11px;
font-size: 24px;
left: 10px;
}
.avia-post-nav .entry-info-wrap{
-moz-transition: all 0.3s ease-out;
-webkit-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
width: 1px;
overflow: hidden;
display: block;
}
[data-av_icon]:before {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-weight: normal;
content: attr(data-av_icon);
speak: none;
font-family: 'entypo-fontello';
}
.avia-post-prev .entry-info {
margin: 0 1px 0 20px;
height: 80px;
width: 220px;
display: table;
}
.avia-post-nav .entry-info span {
display: table-cell;
vertical-align: middle;
font-size: 13px;
line-height: 1.65em;
}
.avia-post-nav .entry-info span {
display: table-cell;
vertical-align: middle;
font-size: 13px;
line-height: 1.65em;
}
.avia-post-nav .entry-image {
height: 80px;
width: 80px;
border-radius: 100px;
background-position: center center;
background-size: cover;
background-repeat: no-repeat;
}
.avia-post-prev {
left: 0;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
}
.avia-post-nav:hover {
background: rgba(0,0,0,0.8);
}
.avia-post-nav:hover .entry-info-wrap {
width: 240px;
}
.avia-post-next.with-image {
text-align: right;
}
.avia-post-next {
right: 0;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
}
.avia-post-next .label {
right: 10px;
}
.avia-post-next .entry-info {
margin: 0 20px 0 1px;
}
Comments
Post a Comment