Доброго времени суток, прошу помощи в таком вопросе.
Как сверстать блок для прокручивания внутри цифр?
Яркий пример тому лайки вконтакте. С помощью картинки с цифрами и изменение ее background-position все получилось.
Но как быть с текстом?
1 ответ
css:
<style>
.cntr{
width:20px;
height:20px;
font-size:18px;
overflow:hidden;
text-align:center;
}
</style>
js:
function plus1(cntr)
{
var cntr=$(cntr),div;
var i=parseInt(cntr.html());//текущее значение
if(isNaN(i))return;//анимация не закончилась
cntr.append(div=$('<div >'+(i+1)+'</div>'));//добавляем следующее число
cntr.animate({scrollTop: div.offset().top}, //прокручиваем до него
{
duration:600,
complete:function(){cntr.html(i+1)}//убираем лишнее после завершения
});
}
body:
<div class=cntr onclick='plus1(this)'>1</div>
Изложил один из способов. Думаю из кода все ясно.
-
-
Расшифровываю: бесполезные действия :) В предыдущей версии передавал селектор - упустил из виду.– KaZaца8 дек 2012 в 9:21
-