Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
リストをアニメーションさせる。右から左へ
<script type="text/javascript">
$(function() {
var _li = $("li.one_line_news");
var _ul = $("#one_line");
var _li_width = 877;
var _li_size = _li.size();
var _numberOf_li = _li_size - 1;
var _count = 0;
var _ul_width = _li_width * _li_size;
var _ul_margin = 0;
var _next_ul_margin = "-" + _li_width;
_li.css({
width: _li_width,
float: "left"
});
_ul.css({
width: _ul_width,
marginLeft: _ul_margin
});
if(_li.length){
var timerID = setInterval(function() {
if(_count == _numberOf_li) {
_count = 0;
_ul.css({marginLeft : _li_width + "px"});
_ul.animate({
marginLeft:"0px"
}, 1500, "swing");
} else {
_ul.animate({
marginLeft : parseInt(_ul.css("margin-left")) - _li_width + "px"
}, 1500, "swing");
_count++;
}
}, 8000);
});
</script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment