jQuery *is* JavaScript, keep that in mind

$(document).ready(function(){
        $("*[id^='bgChangerAnchor').click(function () {
                 var id = this.id.replace('bgChangerAnchor', '');
                 $("#mainContainer").css("background","url(backgrounds/
bg_" + id + ".jpg)");
        });
});



On Apr 7, 3:38 pm, eludlow <edward.lud...@gmail.com> wrote:
> This might not be possible at all - I've tried the code and it's not
> working so I'm guessing it probably isn't possible, but it could also
> be I've done something wrong!
>
> This is the code i have that works:
>
> [code]
> $(document).ready(function(){
>
> $("#bgChangerAnchor1").click(function () {
>         $("#mainContainer").css("background","url(backgrounds/bg_1.jpg)");
>
> });
>
> $("#bgChangerAnchor2").click(function () {
>         $("#mainContainer").css("background","url(backgrounds/bg_2.jpg)");
>
> });
>
> $("#bgChangerAnchor3").click(function () {
>         $("#mainContainer").css("background","url(backgrounds/bg_3.jpg)");
>
> });
>
> $("#bgChangerAnchor4").click(function () {
>         $("#mainContainer").css("background","url(backgrounds/bg_4.jpg)");
>
> });
>
> $("#bgChangerAnchor5").click(function () {
>         $("#mainContainer").css("background","url(backgrounds/bg_5.jpg)");
>
> });
> });[/code]
>
> But I was hoping to condense it down into this:
>
> [code]
> $(document).ready(function(){
>
> for (numBackgrounds=5;numBackgrounds<6;numBackgrounds++) {
>
>         $("#bgChangerAnchor"+numBackgrounds).click(function () {
>                 $("#mainContainer").css("background","url(backgrounds/
> bg_"+numBackgrounds+".jpg)");
>         });
>
> }
> });
>
> [/code]
>
> Any pointers / tips about this would be brilliant, thanks.
>
> All the best,
> Ed Ludlow

Reply via email to