Grow your CSS skills. Land your dream job.

I need a date :)

  • # November 6, 2012 at 11:50 am

    I’m trying to display a few different jpgs depending on what the date is. Below is what I have so far. I’m not the best at jquery so keep that in mind. When I load the page nothing is showing up. Any help is much appreciated.

    HTML:

    jQuery:

    $(document).ready(function() {
    var date=new Date();
    var year=date.getFullYear();
    var day=date.getDate();
    function SetDivContent () {
    var div=document.getElementById(‘date_dependent’);
    if (year==2012 && month==10) {
    if (day>=2 && day<11) {
    $(‘#date_dependent’).html(‘‘);
    }
    else if (day==5 || day==12) {
    $(‘#date_dependent’).html(‘>’);
    }
    else if (day>12) {
    $(‘#date_dependent’).html(‘‘);
    }
    }
    }
    });

    I’ve never had to use the jQuery date functions so I’m not sure if I’m doing this correctly. Also, I read a few conflicting articles that said that the month ranges are from 0 to 11 instead of 1 to 12. Is that true?

    Thanks

    # November 6, 2012 at 12:29 pm

    Hey @kevsyers

    I think you would receive a lot more help if you were to paste your code into [CopePen](http://codepen.io/pen “Go To CodePen”) and then paste the final link back on here.

    Also your images will have to be on a server somewhere as you can just link them relatively.

    There are a few decent jQuery genius’ on this Forum who will more than likely be able to help you out.

    # November 6, 2012 at 12:48 pm

    I made a quick pen to try and sort the code out:

    http://codepen.io/Gordnfreeman/pen/ckGvJ

    Some changes: I used text instead of images (as the links were broken) and had to clean up the code some, mainly removing the function, which could easily be added back in if this is not being done on load and removing the document.getElementById in favor of the jQuery method, along with this i also made it so the code uses an img element instead of a div to do the change. Using date as your variable name was causing some issues so I changed it to todaysdate, you also forgot to set the month variable so I added that. Also your if statements were out of order, you had the date range match before the exact date one. You should check for the exact date match first, then fall back to the other checks, as the code was written the exact check would have never worked as the exact date was within the range that was being checked by the code.

    It is now working for me, for at least the first condition, and changing around the numbers should fix any problems. And yes in jQuery the month ranges seem to be from 0-11, I have actually never noticed that before, but its not that different from working with arrays so it is not a big issue.

    Hopefully this will be of some help to at least get you pointed in the right direction if you have any other questions I am sure myself or someone else can help you out.

    Edit: Changed text to photos of cats to more accurately meet the needs of the question asker.

    # November 6, 2012 at 1:50 pm

    Sorry about that. I posted and then got called away from my desk before I could fix it.

    @Gordnfreeman Thanks for the help. I’m trying it out now. I’ll let you know how it goes.

    # November 6, 2012 at 1:58 pm

    @kevsyers no worries, let me know if it works out.

    # November 6, 2012 at 2:11 pm

    OK. I got it working. Thanks to both of you for your help.

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".