Jquery - Css background modification doesn't work

Question

HTML:

                <div class="rating" id = "r1"></div>
                <div class="rating" id = "r2"></div>
                <div class="rating" id = "r3"></div>
                <div class="rating" id = "r4"></div>
                <div class="rating" id = "r5"></div>

Js (using jquery 1.10.1) :

 <script type = "text/javascript">
                    $(document).ready(function(){
                        var rate = new Array();
                        rate[1] = "r1";
                        rate[2] = "r2";
                        rate[3] = "r3";
                        rate[4] = "r4";
                        rate[5] = "r5";
                        var r = <?php echo $rate;?>
                            for(var i=1; i<=r;i++){
                                var k = rate[i];
                                $('#'+k).css{('background-image': 'url(images/star_green.png)')};

                            }
                    });

                    </script>

Basically what i want to do using this code is to modify the background of the first x divs (number provided in my db). I know that the js variable r takes the right value...same for the k variable...the only thing that i think is not working is the part where the background is set. I tested it using direct values (without the +k part) and it didn't work the either. The page is located in root and the images folder is next to it.

Any suggestions?

PS: The Js script is placed on the page after the divs.

I think you inversed .css({}) with .css{()}

Simon Arnold
– Simon Arnold

2013-10-16 16:20:03 +00:00
Commented Oct 16, 2013 at 16:20 — Simon Arnold
– Simon Arnold, Commented Oct 16, 2013 at 16:20

Gopi Krishna · Accepted Answer · 2013-10-16 16:18:12Z

1

Your missing a semicolon here

var r = <?php echo $rate;?>

It should be

var r = <?php echo $rate;?>;

Also

$('#'+k).css{('background-image': 'url(images/star_green.png)')};

should be

$('#'+k).css({'background-image': 'url(images/star_green.png)'});

answered Oct 16, 2013 at 16:18

Gopi Krishna

4942 silver badges6 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Gopi Krishna Over a year ago

There was another mistake. Edited the answer.

underscore · Accepted Answer · 2013-10-16 16:24:20Z

0

 $(document).ready(function () {
     var rate = new Array();
     rate[1] = "r1";
     rate[2] = "r2";
     rate[3] = "r3";
     rate[4] = "r4";
     rate[5] = "r5";
     var r = <? php echo $rate; ?> ;
     for (var i = 1; i <= r; i++) {
         var k = rate[i];
         $('#' + k).css
             ({'background-image': 'url(images/star_green.png)'});
         };

     }
 });

answered Oct 16, 2013 at 16:24

underscore

6,9277 gold badges44 silver badges82 bronze badges

Comments

user2883324 · Accepted Answer · 2013-10-16 16:48:48Z

0

Please try this.

$('.rating').css('background-image','url(images/image.jpeg)');

answered Oct 16, 2013 at 16:48

user2883324

111 bronze badge

Collectives™ on Stack Overflow

Jquery - Css background modification doesn't work

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related