Results 1 to 7 of 7

Thread: Crawler (no gap marquee) Javascript...

  1. #1
    Join Date
    Aug 2010
    Posts
    45
    Thanks
    6
    Thanked 1 Time in 1 Post

    Default Crawler (no gap marquee) Javascript...

    This is the greatest smoothest marquee I've used to date.
    I have a 15 page site that has the crawler running on all pages.
    I was wondering if there is a way to avoid the Crawler reloading new on every page. The reason being is that I have a lot of logos running across the marquee.. but since you move from page to page only the first 5-10 actually get seen over and over since it starts up again on every page load. I've speed-ed it up so now you see more but...

    Any and all ideas welcome.

    Thanks,

    lasa2

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,377
    Thanks
    77
    Thanked 3,421 Times in 3,382 Posts
    Blog Entries
    12

    Default

    Use this updated version of the script (right click and 'save as'):

    Attachment 3496

    Then for any crawler that you want to exhibit this behavior, set its persist to true (you may omit or set this property to false for any crawler that you don't want to remember its position):

    Code:
    <script type="text/javascript">
    marqueeInit({
    	uniqueid: 'mycrawler2',
    	style: {
    		'padding': '2px',
    		'width': '600px',
    		'height': '180px'
    	},
    	inc: 5, //speed - pixel increment for each iteration of this marquee's movement
    	mouse: 'cursor driven', //mouseover behavior ('pause' 'cursor driven' or false)
    	moveatleast: 2,
    	neutral: 150,
    	persist: true, //set to true for marquee which will resume its previous position on reload
    	savedirection: true
    });
    </script>
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. The Following User Says Thank You to jscheuer1 For This Useful Post:

    lasa2 (08-22-2010)

  4. #3
    Join Date
    Aug 2010
    Posts
    45
    Thanks
    6
    Thanked 1 Time in 1 Post

    Default

    Thanks John,
    I updated the crawler.js.. then I entered the persist: true it works great, it doesn't reload which is awesome!... but now the crawler isn't crawling smoothly (very jittery) and the moveatleast speed seems to be ignored? (one speed regardless)

    If I change the persist to false its runs smooth again but obviously reloads on every new page. Am I doing something weird on my end?
    http://acsshow.org/index.htm (its currently back on false because it was too jittery)

    Lasa2
    Last edited by lasa2; 08-22-2010 at 12:49 PM.

  5. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,377
    Thanks
    77
    Thanked 3,421 Times in 3,382 Posts
    Blog Entries
    12

    Default

    I'm not 100% certain what's what with this modification yet. Here are some things I can tell you:

    1. A cookie is used to preserve the information from one page to another. The name of this cookie is the uniqueid property of the crawler.

    2. I did discover that if I have two different crawlers (different images, different widths) on different pages that have the same uniqueid, things get really weird, not skittish, but disappearing at times. But as long as the crawlers are the same, there's no problem. This can particularly be a problem with local testing where the cookie will be set for the entire hard drive.

    3. Your crawler looks no different to me with the persist set or not. And looks a little skittish either way.

    4. The slower a crawler goes, the smoother it looks.

    5. With a cursor driven crawler like yours, the inc is the top speed when the mouse is over the crawler at its left or right edge. The moveatleast is the constant speed when the mouse is not over the crawler.

    6. The more crawler pages you have open at once and/or the higher the load on the CPU and/or RAM, the less smooth any given crawler will look. This varies by computer and browser, but most systems these days can handle a few crawlers at moderate speeds.

    7. The update from my previous post doesn't take into account the direction of the crawler. If the crawler can change direction when the mouse is out, as yours can, it should remember the current direction.


    As per #2, make sure all your crawlers are the same, same width, same images.

    Your crawler (going by #4 and 5 above) looks much smoother regardless of persist or not when set like so:

    Code:
    <script type="text/javascript">
    marqueeInit({
    	uniqueid: 'mycrawler2',
    	style: {
    		'padding': '1px',
    		'width': '965px',
    		'height': '37px'
    	},
    	inc: 5, //speed - pixel increment for each iteration of this marquee's movement
    	mouse: 'cursor driven', //mouseover behavior ('pause' 'cursor driven' or false)
    	moveatleast: 2,
    	neutral: 150,
           persist: true, //set to true for marquee to resume from previous position
           savedirection: false
    });
    </script>
    When I just checked your page, it was moveatleast 5 - too fast for its contents. Perhaps you sped it up so that more images would get seen. But with the persist set to true, you may slow it down to 2 as shown above. The images will then all get seen, and the scrolling action will be much smoother.

    And here's an update to the update:

    Attachment 3497

    The only change to it is that if the crawler changes direction, it will remember that also.

    Note: The savedirection property has nothing to do with the cookie. It only determines (from the demo page):

    Directional behavior of 'cursor driven' marquee that has a moveatleast property when moused out. Will it remember it's initial direction (true), continue it's current direction (false), or will it reverse ('reverse') its current direction? (defaults to false)
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  6. #5
    Join Date
    Aug 2010
    Posts
    45
    Thanks
    6
    Thanked 1 Time in 1 Post

    Default

    Hi John,
    I've set it up with the updated (2) crawler.js... and set the speeds as per your suggestion, It's working thanks... still not as smooth as with persist set to false, but it is working, not reloading etc.

    Why would the persist: true cause it to not run as smoothly and if set to false?

    Strange an older pc I have shows it running super slow and jittery, but if I set it to false its super smooth on it as well?

    Lasa2

  7. #6
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,377
    Thanks
    77
    Thanked 3,421 Times in 3,382 Posts
    Blog Entries
    12

    Default

    Well, I'm not seeing it here. That may be the browser/computer differences I mentioned in my last post.

    The only thing I can think of is, since one browser I know of doesn't fire the onunload event, I elected to update the cookie every iteration of the crawler's movement.

    This could be adding just enough computational load to create what you are observing.

    To that end, I've created yet another update. This one waits for the onunload event to set the cookie, except in the one browser (Opera) that I know of that doesn't fire it:

    Attachment 3869

    Except for Opera, the script will now function as it does when persist is false, except that it still will remember its position and direction.
    Last edited by jscheuer1; 05-06-2011 at 05:47 PM. Reason: update attachment
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  8. #7
    Join Date
    Aug 2010
    Posts
    45
    Thanks
    6
    Thanked 1 Time in 1 Post

    Default

    John, I can't thank you enough for all the work you've done.
    That last crawler.js did the trick it smooth as glass again.
    awesome work!

    Lasa2

Bookmarks

Posting Permissions

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