View RSS Feed


Crawler Interim Updates

Rate this Entry
Adds: persistence option, oncontentinit option, auto detect of a single table with a single row for optionally randomizing its td's, code efficiencies.

Applies to:

Text and Image Crawler v1.5

What many people don't know about Crawler is that it makes a duplicate train of its text and/or images so that they may be looped/viewed in a continuous manner without spaces or jumpiness.

That's fine as long as you're not trying to initialize that content to another script like a lightbox.

Some people have expressed a desire to have Crawler remember (persist) its state (position and direction) when refreshed and when the same Crawler is on different pages.

This is a drop-in replacement for the current version 1.5 crawler.js file. It adds the ability to run a callback function once the crawler divisions have been populated and made a part of the DOM. Example:

	uniqueid: 'mycrawler2',
	style: {
		'padding': '2px',
		'width': '700px',
		'height': '240px'
	inc: 20, //speed - pixel increment for each iteration of this marquee's movement
	mouse: 'cursor driven', //mouseover behavior ('pause' 'cursor driven' or false)
	moveatleast: 3,
	neutral: 150,
	savedirection: true,
	random: false,
	initcontent: function(contentarray){
		var $ = jQuery;
		if(typeof $ !== 'undefined' && typeof $.fn.fancybox === 'function'){
			$(contentarray[1]).find('a[rel=example_group]').attr('rel', 'example_group2');
				'titlePosition' 	: 'over',
				'titleFormat'		: function(title, currentArray, currentIndex, currentOpts) {
					return '<span id="fancybox-title-over">Image ' + (currentIndex + 1) + ' / ' + currentArray.length + (title.length ? ' &nbsp; ' + title : '') + '</span>';
The contentarray contains two items, contentarray[0] and contentarray[1], which each contain one of the now two trains of images and/or text of the Crawler as HTML code on the page. One or both of these may be used to initialize that content to another script. The keyword this (not used in the above example) would refer to the Crawler instance.

Persistence is easy to add. Example:

 uniqueid: 'art',
 direction: 'right',
 style: { //style object for this marquee container (use quotes on both sides of the : as shown)
	'width': '60%',
	'height': '235px',
	'background-color': '#ddd',
	'border': '1px solid #111',
	'margin': '2ex auto 0 auto'},
 inc: 6, //speed - pixel increment for each iteration of this marquee's movement
 moveatleast: 4,
 persist: true,
 mouse: 'cursor driven' //mouseover behavior ('pause' 'cursor driven' or false)
Here's the updated script (right click and 'Save As'):


It also enhances the script's ability to run in Quirks Mode in IE. And if you choose to make your Crawler's content a single table with a single row, and choose the random option, it will randomize the td's.

Comments are welcome, but will be held back until I determine they're not spam.

If you want help with this code, please post a new thread in the Dynamic Drive Scripts Help section:

and post a link to this Blog entry in your message. Use the word Crawler in your title.

Edit: Oct/9/12 added auto detect table, code efficiencies, details and updated attached script.

Submit "Crawler Interim Updates" to Submit "Crawler Interim Updates" to StumbleUpon Submit "Crawler Interim Updates" to Google Submit "Crawler Interim Updates" to Digg

Updated 10-09-2012 at 10:24 AM by jscheuer1 (add table auto detect, details, update attached script)

Tags: None Add / Edit Tags
DD Scripts Mods , Post a JavaScript