Есть такой код
$('.news-block_main').hover(
function() {
$('.news-block-hover_main').animate({
height: "toggle"
}, 200)('display', 'block');
},
function() {
$('.news-block-hover_main').animate({
height: "toggle"
}, 200)('display', 'none');
}
);
.anews {
position: absolute;
top: 0;
left: 0;
width: 33.33%;
height: 33.33%;
}
.news-block {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
overflow: hidden;
}
.news-block.news-block_main {
width: 200%;
height: 200%;
border-top: 4px solid #0e0f16;
top: 0;
left: 0;
}
.news-block-info {
position: absolute;
top: 92%;
left: 0;
width: 100%;
padding: 2px 21px 9px;
color: #fff4e7;
font-size: .95em;
line-height: 1.2em;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div id="actuallynews" class="anews">
<div class="news-block news-block_main " style="background-image: url(http://i.imgur.com/h4i1dwG.jpg);">
<div class="news-block-hover_main" style="display:none;">
<img src="http://i.imgur.com/QlPUjPg.png">
</div>
</div>
</div>
https://jsfiddle.net/5zpj6oLf/2/
Щас анимация идет сверху-вниз, надо же чтобы снизу-вверх. Как это реализовать?
html
разметку и стили в вопрос