www.webdeveloper.com
Page 1 of 2 12 LastLast
Results 1 to 15 of 29

Thread: new image every week

  1. #1
    Join Date
    Mar 2011
    Posts
    2

    new image every week

    Hi
    I've got 54 images, I'd like a script that displays every monday a new image.
    who can help ?

    thanks
    Laura

  2. #2
    Join Date
    Dec 2005
    Location
    FL
    Posts
    7,357

    Lightbulb Something to try...

    You'll need to substitute your URLs to the images as I have done for this week...
    Code:
    <html>
    <head>
    <title> Week of Year Display </title>
    <script type="text/javascript">
    // For: http://www.webdeveloper.com/forum/showthread.php?t=244093
    
    Date.prototype.getWeek = function() {
      var onejan = new Date(this.getFullYear(),0,1);
      return Math.ceil((((this - onejan) / 86400000) + onejan.getDay()+1)/7);
    }
    var imgList = [
      'url.image0.jpg',   'url.image1.jpg',   'url.image2.jpg',   'url.image3.jpg',   'url.image4.jpg',
      'url.image5.jpg',   'url.image6.jpg',   'url.image7.jpg',   'url.image8.jpg',   'url.image9.jpg',
      'url.image10.jpg',  'url.image11.jpg',  'url.image12.jpg',  'http://www.nova.edu/hpd/otm/pics/4fun/PANIC.JPG',  'url.image14.jpg',
      'url.image15.jpg',  'url.image16.jpg',  'url.image17.jpg',  'url.image18.jpg',  'url.image19.jpg',
      'url.image20.jpg',  'url.image21.jpg',  'url.image22.jpg',  'url.image23.jpg',  'url.image24.jpg',
      'url.image25.jpg',  'url.image26.jpg',  'url.image27.jpg',  'url.image28.jpg',  'url.image29.jpg',
      'url.image30.jpg',  'url.image31.jpg',  'url.image32.jpg',  'url.image33.jpg',  'url.image34.jpg',
      'url.image35.jpg',  'url.image36.jpg',  'url.image37.jpg',  'url.image38.jpg',  'url.image39.jpg',
      'url.image40.jpg',  'url.image41.jpg',  'url.image42.jpg',  'url.image43.jpg',  'url.image44.jpg',
      'url.image45.jpg',  'url.image46.jpg',  'url.image47.jpg',  'url.image48.jpg',  'url.image49.jpg',
      'url.image50.jpg',  'url.image51.jpg'	  // Note: No comma after last entry
    ];
    
    function showImage() {
      var today = new Date();
      var weekno = today.getWeek();
      document.getElementById('WeeklyImage').src = imgList[weekno];
      document.getElementById('WeeklyImage').alt = imgList[weekno];
    //  alert(weekno+'\t'+imgList[weekno]);
    }
    </script>
    
    </head>
    <body onload="showImage()">
    <img id="WeeklyImage" src="" alt="Image of the Week" style="height:100px; width:100px">
    </body>
    </html>
    ... and if the change of image on MONDAY is critical to you,
    you'll need to add some extra logic for this to happen.

    Good Luck!

  3. #3
    Join Date
    Feb 2006
    Posts
    2,927
    Code:
    <!-- If you can name your image files, and suffix each with an integer,
    you can make it simpler: -->
    
    
    <script>
    function mondayImage(){
        var n, now= new Date(), d= new Date(now.getFullYear(), 0, 0);
        while(d.getDay()!== 1) d.setDate(d.getDate()+1);
        n= Math.floor((now-d)/6.048e8);
        document.getElementById('mondayimage').src= '/path/to/image.image'+n+'.jpg';
    }
    window.onload=mondayImage;
    </script>
    </head>
    <body>
    <img id='mondayimage' src="" alt="monday image">

  4. #4
    Join Date
    Mar 2011
    Posts
    2

    thanks

    both scripts work beautifully
    many thanks !

  5. #5
    Join Date
    Dec 2005
    Location
    FL
    Posts
    7,357
    You're most welcome, I'm sure, from both of us.
    Good Luck!

  6. #6
    Join Date
    Feb 2010
    Posts
    11

    How about hourly?

    So if you just want an image to rotate by the hour, put in "getHour" instead?

    And if you want it to loop, add the comma at the end, right?

    I'm just learning, but I want to make sure...

    Thanks!
    Work sucks! Goof off at work!

  7. #7
    Join Date
    Dec 2005
    Location
    FL
    Posts
    7,357

    Question

    Quote Originally Posted by dischg View Post
    So if you just want an image to rotate by the hour, put in "getHour" instead?

    And if you want it to loop, add the comma at the end, right?

    I'm just learning, but I want to make sure...

    Thanks!
    Which post # code are you asking about? There were two solutions.
    What does your attempt look like?
    It's always a good idea to try the modifications yourself so that you can learn from trying!
    If they don't work, then at least we know what you are trying to do with YOUR code.

  8. #8
    Join Date
    Oct 2011
    Posts
    3

    2 weeks

    Hi, i need this but every 2 weeks?

    thanks in advance!

  9. #9
    Join Date
    Dec 2005
    Location
    FL
    Posts
    7,357

    Lightbulb

    Quote Originally Posted by outsiderzone View Post
    Hi, i need this but every 2 weeks?

    thanks in advance!
    Which post script are you using?

    Probably easiest modification would be to get the week of the year
    and do a divide by 2 to determine image or message to display.

    pseudo code: (assumes using something similar to post #2)
    var today = new Date();
    var weekOfYear = today.getWeek();
    var imgPointer = Math.floor(weekOfYear/2);
    // use image pointer to point to element of image array to display
    document.getElementById('WeeklyImage').src = imgList[imgPointer];

  10. #10
    Join Date
    Oct 2011
    Posts
    3
    wow! thanks for your help!

  11. #11
    Join Date
    Dec 2005
    Location
    FL
    Posts
    7,357

    Thumbs up

    Quote Originally Posted by outsiderzone View Post
    wow! thanks for your help!
    You're most welcome.
    Happy to help. (Note could also be applied to every 3+weeks as well)
    Good Luck!

  12. #12
    Join Date
    Jan 2011
    Location
    United Kingdom, London
    Posts
    117
    I found it best to use &#37; operator

    Code:
    mytime = Math.floor((new Date().valueOf())/1000) ; //returns timestamp
    days = Math.floor(mytime/86400) % 4; //days modulo 4 always return 0,1,2,3
    so if you want to rotate it by every 14 days you can just do % 14, that will give you number on what you can base rest of your logic
    Javascript, jQuery / Prototype & PHP expert ready to complete your work on Freelancer.co.uk - Hire Me at https://www.freelancer.co.uk/users/1...&action=hireme

  13. #13
    Join Date
    Oct 2011
    Posts
    3

    wordpress

    thanks for your help!

    i need this to use in wordpress...i need to publish a shotcode ([myshortcode] ) every 2 weeks, how can i do it?

    thanks in advance!

  14. #14
    Join Date
    Dec 2005
    Location
    FL
    Posts
    7,357

    Question Confused ...

    Quote Originally Posted by outsiderzone View Post
    Hi, i need this but every 2 weeks?

    thanks in advance!
    Quote Originally Posted by maurycy View Post
    I found it best to use % operator

    Code:
    mytime = Math.floor((new Date().valueOf())/1000) ; //returns timestamp
    days = Math.floor(mytime/86400) % 4; //days modulo 4 always return 0,1,2,3
    so if you want to rotate it by every 14 days you can just do % 14, that will give you number on what you can base rest of your logic
    I read the original request that the image or message would change every 2 weeks, ie;
    stable message for a 2 week period and then changed.
    This assumption is based on post #8 and #10 where OP originally referred to post #2 code, I thought.

    Your code seems to change every day for a 4 day, if you % 4,
    or a 2 week period, if you % 14, and then repeats the images or messages.

    What ever the OP wants is fine, but it would be nice to know what the exact requirements are as the request is somewhat vague!

  15. #15
    Join Date
    Mar 2006
    Posts
    10
    Post #3 works perfectly, well almost. We are currently in week 13 (and Monday 13) of the year, but it is pulling image12.jpg

    Any suggestions?

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles