jq实现饿了么分类标题向上推动效果

可以使用jQuery的`animate()`函数来实现饿了么分类标题向上推动效果。

首先，给每个分类标题的父元素（例如`<div class="category">`）添加一个`hover`事件，当鼠标移入时触发下面的动画效果：

$('.category').hover(function() {
    $(this).find('.title').stop().animate({
        marginTop: '-10px'
    }, 300);
}, function() {
    $(this).find('.title').stop().animate({
        marginTop: '0'
    }, 300);
});

上面的代码中，`find()`函数用于查找当前分类标题父元素下的`.title`子元素，`.stop()`函数用于停止当前正在运行的动画，`animate()`函数用于实现从当前位置向上推动10像素的动画效果，并在300毫秒内完成。当鼠标移出时，再将`.title`子元素恢复原位。

完整代码示例如下：

<style>
    .category {
        width: 200px;
        height: 100px;
        background-color: #f5f5f5;
        border: 1px solid #ccc;
        margin-bottom: 20px;
        overflow: hidden;
    }
    .title {
        font-size: 18px;
        font-weight: bold;
        text-align: center;
        margin-top: 20px;
    }
</style>

<div class="category">
    <div class="title">分类标题1</div>
    <div class="content">分类内容1</div>
</div>

<div class="category">
    <div class="title">分类标题2</div>
    <div class="content">分类内容2</div>
</div>

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
    $(function() {
        $('.category').hover(function() {
            $(this).find('.title').stop().animate({
                marginTop: '-10px'
            }, 300);
        }, function() {
            $(this).find('.title').stop().animate({
                marginTop: '0'
            }, 300);
        });
    });
</script>