用jquery实现鼠标滑动星级评分特效

         此作品是一款非常实用的星级评分Jquery特效,虽然简单但是很实用,只用了Jquery的一些基础功能就实现了,非常适合网友们学习哦,大家好好看一下吧。

用jquery实现鼠标滑动星级评分特效


核心代码如下:

$(function(){

    var flag = 1;  

    $(‘.star_ul a’).hover(function(){

        flag = 1;

        $(‘.star_ul a’).removeClass(‘active-star’);

        $(this).addClass(‘active-star’);

        $(‘.s_result’).css(‘color’,'#c00′).html($(this).attr(‘title’))

    },function(){

        if( flag == 1){

        $(this).removeClass(‘active-star’);
        $(‘.s_result’).css(‘color’,'#333′).html(‘请打分’)

        }

    });

    $(‘.star_ul a’).click(function(){

         flag = 2;

        $(this).addClass(‘active-star’);

        $(‘.s_result’).css(‘color’,'#c00′).html($(this).attr(‘title’))

        });

    $(‘.square_ul a’).hover(function(){

        flag = 3;

        $(‘.square_ul a’).removeClass(‘active-square’);

        $(this).addClass(‘active-square’);

        $(this).parents(‘.starbox’).find(‘.s_result_square’).css(‘color’,'#c00′).html($(this).attr(‘title’))

    },function(){

        if(flag == 3){

        $(this).removeClass(‘active-square’);

        $(this).parents(‘.starbox’).find(‘.s_result_square’).css(‘color’,'#333′).html(‘请打分’)

    }
    });

    $(‘.square_ul a’).click(function(){

        flag = 4;

        $(this).addClass(‘active-square’);

        $(this).parents(‘.starbox’).find(‘.s_result_square’).css(‘color’,'#c00′).html($(this).attr(‘title’))    });

})

用jquery实现鼠标滑动星级评分特效 用jquery实现鼠标滑动星级评分特效

摘自: 移动开发网
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值