// Example: News feed rotator
// Step 1
// $(document).ready(function() {
// $('#news-feed').each(function() {
// var $container = $(this);
// $container.empty();
// });
// });
// Step 2
// $(document).ready(function() {
// $('#news-feed').each(function() {
// var $container = $(this);
// $container.empty();
// $.get('news/feed.xml', function(data) {
// $('rss item', data).each(function() {
// // Work with the headlines here.
// });
// });
// });
// });
// Step 3
// $(document).ready(function() {
// $('#news-feed').each(function() {
// var $container = $(this);
// $container.empty();
// $.get('news/feed.xml', function(data) {
// $('rss item', data).each(function() {
// var $link = $('')
// .attr('href', $('link', this).text())
// .text($('title', this).text());
// var $headline = $('
').append($link);
//
// $('')
// .append($headline)
// .appendTo($container);
// });
// });
// });
// });
// Step 4
// $(document).ready(function() {
// $('#news-feed').each(function() {
// var $container = $(this);
// $container.empty();
// $.get('news/feed.xml', function(data) {
// $('rss item', data).each(function() {
// var $link = $('')
// .attr('href', $('link', this).text())
// .text($('title', this).text());
// var $headline = $('').append($link);
//
// var pubDate = new Date($('pubDate', this).text());
// var pubMonth = pubDate.getMonth() + 1;
// var pubDay = pubDate.getDate();
// var pubYear = pubDate.getFullYear();
// var $publication = $('')
// .addClass('publication-date')
// .text(pubMonth + '/' + pubDay + '/' + pubYear);
//
// var $summary = $('')
// .addClass('summary')
// .html($('description', this).text());
//
// $('')
// .append($headline, $publication, $summary)
// .appendTo($container);
// });
// });
// });
// });
// Step 5
// $(document).ready(function() {
// $('#news-feed').each(function() {
// var $container = $(this);
// $container.empty();
// $.get('news/feed.xml', function(data) {
// $('rss item', data).each(function() {
// var $link = $('')
// .attr('href', $('link', this).text())
// .text($('title', this).text());
// var $headline = $('').append($link);
//
// var pubDate = new Date($('pubDate', this).text());
// var pubMonth = pubDate.getMonth() + 1;
// var pubDay = pubDate.getDate();
// var pubYear = pubDate.getFullYear();
// var $publication = $('')
// .addClass('publication-date')
// .text(pubMonth + '/' + pubDay + '/' + pubYear);
//
// var $summary = $('')
// .addClass('summary')
// .html($('description', this).text());
//
// $('')
// .addClass('headline')
// .append($headline, $publication, $summary)
// .appendTo($container);
// });
// });
// });
// });
// Step 6
// $(document).ready(function() {
// $('#news-feed').each(function() {
// var $container = $(this);
// $container.empty();
// $.get('news/feed.xml', function(data) {
// $('rss item', data).each(function() {
// var $link = $('')
// .attr('href', $('link', this).text())
// .text($('title', this).text());
// var $headline = $('').append($link);
//
// var pubDate = new Date($('pubDate', this).text());
// var pubMonth = pubDate.getMonth() + 1;
// var pubDay = pubDate.getDate();
// var pubYear = pubDate.getFullYear();
// var $publication = $('')
// .addClass('publication-date')
// .text(pubMonth + '/' + pubDay + '/' + pubYear);
//
// var $summary = $('')
// .addClass('summary')
// .html($('description', this).text());
//
// $('')
// .addClass('headline')
// .append($headline, $publication, $summary)
// .appendTo($container);
// });
//
// var currentHeadline = 0, oldHeadline = 0;
// var hiddenPosition = $container.height() + 10;
// $('div.headline').eq(currentHeadline).css('top', 0);
// });
// });
// });
// Step 7
// $(document).ready(function() {
// $('#news-feed').each(function() {
// var $container = $(this);
// $container.empty();
// $.get('news/feed.xml', function(data) {
// $('rss item', data).each(function() {
// var $link = $('')
// .attr('href', $('link', this).text())
// .text($('title', this).text());
// var $headline = $('').append($link);
//
// var pubDate = new Date($('pubDate', this).text());
// var pubMonth = pubDate.getMonth() + 1;
// var pubDay = pubDate.getDate();
// var pubYear = pubDate.getFullYear();
// var $publication = $('')
// .addClass('publication-date')
// .text(pubMonth + '/' + pubDay + '/' + pubYear);
//
// var $summary = $('')
// .addClass('summary')
// .html($('description', this).text());
//
// $('')
// .addClass('headline')
// .append($headline, $publication, $summary)
// .appendTo($container);
// });
//
// var currentHeadline = 0, oldHeadline = 0;
// var hiddenPosition = $container.height() + 10;
// $('div.headline').eq(currentHeadline).css('top', 0);
// var headlineCount = $('div.headline').length;
// var headlineTimeout;
//
// var headlineRotate = function() {
// currentHeadline = (oldHeadline + 1) % headlineCount;
// // Animate the headline positions here.
// oldHeadline = currentHeadline;
// };
// });
// });
// });
// Step 8
// $(document).ready(function() {
// $('#news-feed').each(function() {
// var $container = $(this);
// $container.empty();
// $.get('news/feed.xml', function(data) {
// $('rss item', data).each(function() {
// var $link = $('')
// .attr('href', $('link', this).text())
// .text($('title', this).text());
// var $headline = $('').append($link);
//
// var pubDate = new Date($('pubDate', this).text());
// var pubMonth = pubDate.getMonth() + 1;
// var pubDay = pubDate.getDate();
// var pubYear = pubDate.getFullYear();
// var $publication = $('')
// .addClass('publication-date')
// .text(pubMonth + '/' + pubDay + '/' + pubYear);
//
// var $summary = $('')
// .addClass('summary')
// .html($('description', this).text());
//
// $('')
// .addClass('headline')
// .append($headline, $publication, $summary)
// .appendTo($container);
// });
//
// var currentHeadline = 0, oldHeadline = 0;
// var hiddenPosition = $container.height() + 10;
// $('div.headline').eq(currentHeadline).css('top', 0);
// var headlineCount = $('div.headline').length;
// var pause;
//
// var headlineRotate = function() {
// currentHeadline = (oldHeadline + 1) % headlineCount;
// $('div.headline').eq(oldHeadline).animate(
// {top: -hiddenPosition}, 'slow', function() {
// $(this).css('top', hiddenPosition);
// });
// $('div.headline').eq(currentHeadline).animate(
// {top: 0}, 'slow', function() {
// pause = setTimeout(headlineRotate, 5000);
// });
// oldHeadline = currentHeadline;
// };
// pause = setTimeout(headlineRotate, 5000);
// });
// });
// });
// Step 9
// $(document).ready(function() {
// $('#news-feed').each(function() {
// var $container = $(this);
// $container.empty();
// $.get('news/feed.xml', function(data) {
// $('rss item', data).each(function() {
// var $link = $('')
// .attr('href', $('link', this).text())
// .text($('title', this).text());
// var $headline = $('').append($link);
//
// var pubDate = new Date($('pubDate', this).text());
// var pubMonth = pubDate.getMonth() + 1;
// var pubDay = pubDate.getDate();
// var pubYear = pubDate.getFullYear();
// var $publication = $('')
// .addClass('publication-date')
// .text(pubMonth + '/' + pubDay + '/' + pubYear);
//
// var $summary = $('')
// .addClass('summary')
// .html($('description', this).text());
//
// $('')
// .addClass('headline')
// .append($headline, $publication, $summary)
// .appendTo($container);
// });
//
// var currentHeadline = 0, oldHeadline = 0;
// var hiddenPosition = $container.height() + 10;
// $('div.headline').eq(currentHeadline).css('top', 0);
// var headlineCount = $('div.headline').length;
// var pause;
//
// var headlineRotate = function() {
// currentHeadline = (oldHeadline + 1) % headlineCount;
// $('div.headline').eq(oldHeadline).animate(
// {top: -hiddenPosition}, 'slow', function() {
// $(this).css('top', hiddenPosition);
// });
// $('div.headline').eq(currentHeadline).animate(
// {top: 0}, 'slow', function() {
// pause = setTimeout(headlineRotate, 5000);
// });
// oldHeadline = currentHeadline;
// };
// pause = setTimeout(headlineRotate, 5000);
//
// $container.hover(function() {
// clearTimeout(pause);
// }, function() {
// pause = setTimeout(headlineRotate, 250);
// });
// });
// });
// });
// Step 10
// $(document).ready(function() {
// $('#news-feed').each(function() {
// var $container = $(this);
// $container.empty();
// $.get('news/feed.xml', function(data) {
// $('rss item', data).each(function() {
// var $link = $('')
// .attr('href', $('link', this).text())
// .text($('title', this).text());
// var $headline = $('').append($link);
//
// var pubDate = new Date($('pubDate', this).text());
// var pubMonth = pubDate.getMonth() + 1;
// var pubDay = pubDate.getDate();
// var pubYear = pubDate.getFullYear();
// var $publication = $('')
// .addClass('publication-date')
// .text(pubMonth + '/' + pubDay + '/' + pubYear);
//
// var $summary = $('')
// .addClass('summary')
// .html($('description', this).text());
//
// $('')
// .addClass('headline')
// .append($headline, $publication, $summary)
// .appendTo($container);
// });
//
// var currentHeadline = 0, oldHeadline = 0;
// var hiddenPosition = $container.height() + 10;
// $('div.headline').eq(currentHeadline).css('top', 0);
// var headlineCount = $('div.headline').length;
// var pause;
// var rotateInProgress = false;
//
// var headlineRotate = function() {
// if (!rotateInProgress) {
// rotateInProgress = true;
// currentHeadline = (oldHeadline + 1)
// % headlineCount;
// $('div.headline').eq(oldHeadline).animate(
// {top: -hiddenPosition}, 'slow', function() {
// $(this).css('top', hiddenPosition);
// });
// $('div.headline').eq(currentHeadline).animate(
// {top: 0}, 'slow', function() {
// rotateInProgress = false;
// pause = setTimeout(headlineRotate, 5000);
// });
// oldHeadline = currentHeadline;
// }
// };
// pause = setTimeout(headlineRotate, 5000);
//
// $container.hover(function() {
// clearTimeout(pause);
// }, function() {
// pause = setTimeout(headlineRotate, 250);
// });
// });
// });
// });
// Step 11
// $(document).ready(function() {
// $('#news-feed').each(function() {
// var $container = $(this);
// $container.empty();
// $.get('news/feed.xml', function(data) {
// $('rss item', data).each(function() {
// var $link = $('')
// .attr('href', $('link', this).text())
// .text($('title', this).text());
// var $headline = $('').append($link);
//
// var pubDate = new Date($('pubDate', this).text());
// var pubMonth = pubDate.getMonth() + 1;
// var pubDay = pubDate.getDate();
// var pubYear = pubDate.getFullYear();
// var $publication = $('')
// .addClass('publication-date')
// .text(pubMonth + '/' + pubDay + '/' + pubYear);
//
// var $summary = $('')
// .addClass('summary')
// .html($('description', this).text());
//
// $('')
// .addClass('headline')
// .append($headline, $publication, $summary)
// .appendTo($container);
// });
//
// var currentHeadline = 0, oldHeadline = 0;
// var hiddenPosition = $container.height() + 10;
// $('div.headline').eq(currentHeadline).css('top', 0);
// var headlineCount = $('div.headline').length;
// var pause;
// var rotateInProgress = false;
//
// var headlineRotate = function() {
// if (!rotateInProgress) {
// rotateInProgress = true;
// pause = false;
// currentHeadline = (oldHeadline + 1)
// % headlineCount;
// $('div.headline').eq(oldHeadline).animate(
// {top: -hiddenPosition}, 'slow', function() {
// $(this).css('top', hiddenPosition);
// });
// $('div.headline').eq(currentHeadline).animate(
// {top: 0}, 'slow', function() {
// rotateInProgress = false;
// if (!pause) {
// pause = setTimeout(headlineRotate, 5000);
// }
// });
// oldHeadline = currentHeadline;
// }
// };
// if (!pause) {
// pause = setTimeout(headlineRotate, 5000);
// }
//
// $container.hover(function() {
// clearTimeout(pause);
// pause = false;
// }, function() {
// if (!pause) {
// pause = setTimeout(headlineRotate, 250);
// }
// });
// });
// });
// });
// Step 12
// $(document).ready(function() {
// $('#news-feed').each(function() {
// var $container = $(this);
// $container.empty();
// $.get('news/feed.php', function(data) {
// $('rss item', data).each(function() {
// var $link = $('')
// .attr('href', $('link', this).text())
// .text($('title', this).text());
// var $headline = $('').append($link);
//
// var pubDate = new Date($('pubDate', this).text());
// var pubMonth = pubDate.getMonth() + 1;
// var pubDay = pubDate.getDate();
// var pubYear = pubDate.getFullYear();
// var $publication = $('')
// .addClass('publication-date')
// .text(pubMonth + '/' + pubDay + '/' + pubYear);
//
// var $summary = $('')
// .addClass('summary')
// .html($('description', this).text());
//
// $('')
// .addClass('headline')
// .append($headline, $publication, $summary)
// .appendTo($container);
// });
//
// var currentHeadline = 0, oldHeadline = 0;
// var hiddenPosition = $container.height() + 10;
// $('div.headline').eq(currentHeadline).css('top', 0);
// var headlineCount = $('div.headline').length;
// var pause;
// var rotateInProgress = false;
//
// var headlineRotate = function() {
// if (!rotateInProgress) {
// rotateInProgress = true;
// pause = false;
// currentHeadline = (oldHeadline + 1)
// % headlineCount;
// $('div.headline').eq(oldHeadline).animate(
// {top: -hiddenPosition}, 'slow', function() {
// $(this).css('top', hiddenPosition);
// });
// $('div.headline').eq(currentHeadline).animate(
// {top: 0}, 'slow', function() {
// rotateInProgress = false;
// if (!pause) {
// pause = setTimeout(headlineRotate, 5000);
// }
// });
// oldHeadline = currentHeadline;
// }
// };
// if (!pause) {
// pause = setTimeout(headlineRotate, 5000);
// }
//
// $container.hover(function() {
// clearTimeout(pause);
// pause = false;
// }, function() {
// if (!pause) {
// pause = setTimeout(headlineRotate, 250);
// }
// });
// });
// });
// });
// Step 13
// $(document).ready(function() {
// $('#news-feed').each(function() {
// var $container = $(this);
// $container.empty();
// var $loadingIndicator = $('
')
// .attr({
// 'src': 'images/loading.gif',
// 'alt': 'Loading. Please wait.'
// })
// .addClass('news-wait')
// .appendTo($container);
//
// $.get('news/feed.php', function(data) {
// $loadingIndicator.remove();
// $('rss item', data).each(function() {
// var $link = $('')
// .attr('href', $('link', this).text())
// .text($('title', this).text());
// var $headline = $('').append($link);
//
// var pubDate = new Date($('pubDate', this).text());
// var pubMonth = pubDate.getMonth() + 1;
// var pubDay = pubDate.getDate();
// var pubYear = pubDate.getFullYear();
// var $publication = $('')
// .addClass('publication-date')
// .text(pubMonth + '/' + pubDay + '/' + pubYear);
//
// var $summary = $('')
// .addClass('summary')
// .html($('description', this).text());
//
// $('')
// .addClass('headline')
// .append($headline, $publication, $summary)
// .appendTo($container);
// });
//
// var currentHeadline = 0, oldHeadline = 0;
// var hiddenPosition = $container.height() + 10;
// $('div.headline').eq(currentHeadline).css('top', 0);
// var headlineCount = $('div.headline').length;
// var pause;
// var rotateInProgress = false;
//
// var headlineRotate = function() {
// if (!rotateInProgress) {
// rotateInProgress = true;
// pause = false;
// currentHeadline = (oldHeadline + 1)
// % headlineCount;
// $('div.headline').eq(oldHeadline).animate(
// {top: -hiddenPosition}, 'slow', function() {
// $(this).css('top', hiddenPosition);
// });
// $('div.headline').eq(currentHeadline).animate(
// {top: 0}, 'slow', function() {
// rotateInProgress = false;
// if (!pause) {
// pause = setTimeout(headlineRotate, 5000);
// }
// });
// oldHeadline = currentHeadline;
// }
// };
// if (!pause) {
// pause = setTimeout(headlineRotate, 5000);
// }
//
// $container.hover(function() {
// clearTimeout(pause);
// pause = false;
// }, function() {
// if (!pause) {
// pause = setTimeout(headlineRotate, 250);
// }
// });
// });
// });
// });
// Step 14
// $(document).ready(function() {
// $('#news-feed').each(function() {
// var $container = $(this);
// $container.empty();
//
// var fadeHeight = $container.height() / 4;
// for (var yPos = 0; yPos < fadeHeight; yPos += 2) {
// $('')
// .addClass('fade-slice')
// .appendTo($container);
// }
//
// var $loadingIndicator = $('
')
// .attr({
// 'src': 'images/loading.gif',
// 'alt': 'Loading. Please wait.'
// })
// .addClass('news-wait')
// .appendTo($container);
//
// $.get('news/feed.php', function(data) {
// $loadingIndicator.remove();
// $('rss item', data).each(function() {
// var $link = $('')
// .attr('href', $('link', this).text())
// .text($('title', this).text());
// var $headline = $('').append($link);
//
// var pubDate = new Date($('pubDate', this).text());
// var pubMonth = pubDate.getMonth() + 1;
// var pubDay = pubDate.getDate();
// var pubYear = pubDate.getFullYear();
// var $publication = $('')
// .addClass('publication-date')
// .text(pubMonth + '/' + pubDay + '/' + pubYear);
//
// var $summary = $('')
// .addClass('summary')
// .html($('description', this).text());
//
// $('')
// .addClass('headline')
// .append($headline, $publication, $summary)
// .appendTo($container);
// });
//
// var currentHeadline = 0, oldHeadline = 0;
// var hiddenPosition = $container.height() + 10;
// $('div.headline').eq(currentHeadline).css('top', 0);
// var headlineCount = $('div.headline').length;
// var pause;
// var rotateInProgress = false;
//
// var headlineRotate = function() {
// if (!rotateInProgress) {
// rotateInProgress = true;
// pause = false;
// currentHeadline = (oldHeadline + 1)
// % headlineCount;
// $('div.headline').eq(oldHeadline).animate(
// {top: -hiddenPosition}, 'slow', function() {
// $(this).css('top', hiddenPosition);
// });
// $('div.headline').eq(currentHeadline).animate(
// {top: 0}, 'slow', function() {
// rotateInProgress = false;
// if (!pause) {
// pause = setTimeout(headlineRotate, 5000);
// }
// });
// oldHeadline = currentHeadline;
// }
// };
// if (!pause) {
// pause = setTimeout(headlineRotate, 5000);
// }
//
// $container.hover(function() {
// clearTimeout(pause);
// pause = false;
// }, function() {
// if (!pause) {
// pause = setTimeout(headlineRotate, 250);
// }
// });
// });
// });
// });
// Step 15
$(document).ready(function() {
$('#news-feed').each(function() {
var $container = $(this);
$container.empty();
var fadeHeight = $container.height() / 4;
for (var yPos = 0; yPos < fadeHeight; yPos += 2) {
$('').css({
opacity: yPos / fadeHeight,
top: $container.height() - fadeHeight + yPos
}).addClass('fade-slice').appendTo($container);
}
var $loadingIndicator = $('
')
.attr({
'src': 'images/loading.gif',
'alt': 'Loading. Please wait.'
})
.addClass('news-wait')
.appendTo($container);
$.get('news/feed.php', function(data) {
$loadingIndicator.remove();
$('rss item', data).each(function() {
var $link = $('')
.attr('href', $('link', this).text())
.text($('title', this).text());
var $headline = $('').append($link);
var pubDate = new Date($('pubDate', this).text());
var pubMonth = pubDate.getMonth() + 1;
var pubDay = pubDate.getDate();
var pubYear = pubDate.getFullYear();
var $publication = $('')
.addClass('publication-date')
.text(pubMonth + '/' + pubDay + '/' + pubYear);
var $summary = $('')
.addClass('summary')
.html($('description', this).text());
$('')
.addClass('headline')
.append($headline, $publication, $summary)
.appendTo($container);
});
var currentHeadline = 0, oldHeadline = 0;
var hiddenPosition = $container.height() + 10;
$('div.headline').eq(currentHeadline).css('top', 0);
var headlineCount = $('div.headline').length;
var pause;
var rotateInProgress = false;
var headlineRotate = function() {
if (!rotateInProgress) {
rotateInProgress = true;
pause = false;
currentHeadline = (oldHeadline + 1)
% headlineCount;
$('div.headline').eq(oldHeadline).animate(
{top: -hiddenPosition}, 'slow', function() {
$(this).css('top', hiddenPosition);
});
$('div.headline').eq(currentHeadline).animate(
{top: 0}, 'slow', function() {
rotateInProgress = false;
if (!pause) {
pause = setTimeout(headlineRotate, 5000);
}
});
oldHeadline = currentHeadline;
}
};
if (!pause) {
pause = setTimeout(headlineRotate, 5000);
}
$container.hover(function() {
clearTimeout(pause);
pause = false;
}, function() {
if (!pause) {
pause = setTimeout(headlineRotate, 250);
}
});
});
});
});
// Example: Image Carousel
// Step 1
// $(document).ready(function() {
// var spacing = 140;
//
// $('#featured-books').css({
// 'width': spacing * 3,
// 'height': '166px',
// 'overflow': 'hidden'
// }).find('.covers a').css({
// 'float': 'none',
// 'position': 'absolute',
// 'left': 1000
// });
//
// var $covers = $('#featured-books .covers a');
//
// $covers.eq(0).css('left', 0);
// $covers.eq(1).css('left', spacing);
// $covers.eq(2).css('left', spacing * 2);
// });
// Step 2
// $(document).ready(function() {
// var spacing = 140;
//
// $('#featured-books').css({
// 'width': spacing * 3,
// 'height': '166px',
// 'overflow': 'hidden'
// }).find('.covers a').css({
// 'float': 'none',
// 'position': 'absolute',
// 'left': 1000
// });
//
// var setUpCovers = function() {
// var $covers = $('#featured-books .covers a');
//
// $covers.unbind('click');
//
// // Left image; scroll right (to view images on left).
// $covers.eq(0)
// .css('left', 0)
// .click(function(event) {
// $covers.eq(2).css('left', 1000);
// $covers.eq($covers.length - 1)
// .prependTo('#featured-books .covers');
// setUpCovers();
//
// event.preventDefault();
// });
//
// // Right image; scroll left (to view images on right).
// $covers.eq(2)
// .css('left', spacing * 2)
// .click(function(event) {
// $covers.eq(0).css('left', 1000);
// $covers.eq(0)
// .appendTo('#featured-books .covers');
// setUpCovers();
//
// event.preventDefault();
// });
//
// // Center image.
// $covers.eq(1)
// .css('left', spacing);
// };
//
// setUpCovers();
// });
// Step 3
// $(document).ready(function() {
// var spacing = 140;
//
// $('#featured-books').css({
// 'width': spacing * 3,
// 'height': '166px',
// 'overflow': 'hidden'
// }).find('.covers a').css({
// 'float': 'none',
// 'position': 'absolute',
// 'left': 1000
// });
//
// var setUpCovers = function() {
// var $covers = $('#featured-books .covers a');
//
// $covers.unbind('click');
//
// // Left image; scroll right (to view images on left).
// $covers.eq(0)
// .css('left', 0)
// .click(function(event) {
// $covers.eq(0).animate({'left': spacing}, 'fast');
// $covers.eq(1).animate({'left': spacing * 2}, 'fast');
// $covers.eq(2).animate({'left': spacing * 3}, 'fast');
// $covers.eq($covers.length - 1)
// .css('left', -spacing)
// .animate({'left': 0}, 'fast', function() {
// $(this).prependTo('#featured-books .covers');
// setUpCovers();
// });
//
// event.preventDefault();
// });
//
// // Right image; scroll left (to view images on right).
// $covers.eq(2)
// .css('left', spacing * 2)
// .click(function(event) {
// $covers.eq(0)
// .animate({'left': -spacing}, 'fast', function() {
// $(this).appendTo('#featured-books .covers');
// setUpCovers();
// });
// $covers.eq(1).animate({'left': 0}, 'fast');
// $covers.eq(2).animate({'left': spacing}, 'fast');
// $covers.eq(3)
// .css('left', spacing * 3)
// .animate({'left': spacing * 2}, 'fast');
//
// event.preventDefault();
// });
//
// // Center image.
// $covers.eq(1)
// .css('left', spacing);
// };
//
// setUpCovers();
// });
// Step 4
// $(document).ready(function() {
// var spacing = 140;
//
// function createControl(src) {
// return $('
')
// .attr('src', src)
// .addClass('control')
// .css('opacity', 0.6)
// .css('display', 'none');
// }
//
// var $leftRollover = createControl('images/left.gif');
// var $rightRollover = createControl('images/right.gif');
// var $enlargeRollover = createControl('images/enlarge.gif');
//
// $('#featured-books').css({
// 'width': spacing * 3,
// 'height': '166px',
// 'overflow': 'hidden'
// }).find('.covers a').css({
// 'float': 'none',
// 'position': 'absolute',
// 'left': 1000
// });
//
// var setUpCovers = function() {
// var $covers = $('#featured-books .covers a');
//
// $covers.unbind('click mouseenter mouseleave');
//
// // Left image; scroll right (to view images on left).
// $covers.eq(0)
// .css('left', 0)
// .click(function(event) {
// $covers.eq(0).animate({'left': spacing}, 'fast');
// $covers.eq(1).animate({'left': spacing * 2}, 'fast');
// $covers.eq(2).animate({'left': spacing * 3}, 'fast');
// $covers.eq($covers.length - 1)
// .css('left', -spacing)
// .animate({'left': 0}, 'fast', function() {
// $(this).prependTo('#featured-books .covers');
// setUpCovers();
// });
//
// event.preventDefault();
// }).hover(function() {
// $leftRollover.appendTo(this).show();
// }, function() {
// $leftRollover.hide();
// });
//
// // Right image; scroll left (to view images on right).
// $covers.eq(2)
// .css('left', spacing * 2)
// .click(function(event) {
// $covers.eq(0)
// .animate({'left': -spacing}, 'fast', function() {
// $(this).appendTo('#featured-books .covers');
// setUpCovers();
// });
// $covers.eq(1).animate({'left': 0}, 'fast');
// $covers.eq(2).animate({'left': spacing}, 'fast');
// $covers.eq(3)
// .css('left', spacing * 3)
// .animate({'left': spacing * 2}, 'fast');
//
// event.preventDefault();
// }).hover(function() {
// $rightRollover.appendTo(this).show();
// }, function() {
// $rightRollover.hide();
// });
//
// // Center image.
// $covers.eq(1)
// .css('left', spacing)
// .hover(function() {
// $enlargeRollover.appendTo(this).show();
// }, function() {
// $enlargeRollover.hide();
// });
// };
//
// setUpCovers();
// });
// Step 5
// $(document).ready(function() {
// var spacing = 140;
//
// function createControl(src) {
// return $('
')
// .attr('src', src)
// .addClass('control')
// .css('opacity', 0.6)
// .css('display', 'none');
// }
//
// var $leftRollover = createControl('images/left.gif');
// var $rightRollover = createControl('images/right.gif');
// var $enlargeRollover = createControl('images/enlarge.gif');
// var $enlargedCover = $('
')
// .addClass('enlarged')
// .hide()
// .appendTo('body');
//
// $('#featured-books').css({
// 'width': spacing * 3,
// 'height': '166px',
// 'overflow': 'hidden'
// }).find('.covers a').css({
// 'float': 'none',
// 'position': 'absolute',
// 'left': 1000
// });
//
// var setUpCovers = function() {
// var $covers = $('#featured-books .covers a');
//
// $covers.unbind('click mouseenter mouseleave');
//
// // Left image; scroll right (to view images on left).
// $covers.eq(0)
// .css('left', 0)
// .click(function(event) {
// $covers.eq(0).animate({'left': spacing}, 'fast');
// $covers.eq(1).animate({'left': spacing * 2}, 'fast');
// $covers.eq(2).animate({'left': spacing * 3}, 'fast');
// $covers.eq($covers.length - 1)
// .css('left', -spacing)
// .animate({'left': 0}, 'fast', function() {
// $(this).prependTo('#featured-books .covers');
// setUpCovers();
// });
//
// event.preventDefault();
// }).hover(function() {
// $leftRollover.appendTo(this).show();
// }, function() {
// $leftRollover.hide();
// });
//
// // Right image; scroll left (to view images on right).
// $covers.eq(2)
// .css('left', spacing * 2)
// .click(function(event) {
// $covers.eq(0)
// .animate({'left': -spacing}, 'fast', function() {
// $(this).appendTo('#featured-books .covers');
// setUpCovers();
// });
// $covers.eq(1).animate({'left': 0}, 'fast');
// $covers.eq(2).animate({'left': spacing}, 'fast');
// $covers.eq(3)
// .css('left', spacing * 3)
// .animate({'left': spacing * 2}, 'fast');
//
// event.preventDefault();
// }).hover(function() {
// $rightRollover.appendTo(this).show();
// }, function() {
// $rightRollover.hide();
// });
//
// // Center image; enlarge cover.
// $covers.eq(1)
// .css('left', spacing)
// .click(function(event) {
// $enlargedCover.attr('src', $(this).attr('href'))
// .css({
// 'left': ($('body').width() - 360) / 2,
// 'top' : 100,
// 'width': 360,
// 'height': 444
// })
// .show()
// .one('click', function() {
// $enlargedCover.fadeOut();
// });
// event.preventDefault();
// })
// .hover(function() {
// $enlargeRollover.appendTo(this).show();
// }, function() {
// $enlargeRollover.hide();
// });
// };
//
// setUpCovers();
// });
// Step 6
// $(document).ready(function() {
// var spacing = 140;
//
// function createControl(src) {
// return $('
')
// .attr('src', src)
// .addClass('control')
// .css('opacity', 0.6)
// .css('display', 'none');
// }
//
// var $leftRollover = createControl('images/left.gif');
// var $rightRollover = createControl('images/right.gif');
// var $enlargeRollover = createControl('images/enlarge.gif');
// var $enlargedCover = $('
')
// .addClass('enlarged')
// .hide()
// .appendTo('body');
// var $closeButton = createControl('images/close.gif')
// .addClass('enlarged-control')
// .appendTo('body');
//
// $('#featured-books').css({
// 'width': spacing * 3,
// 'height': '166px',
// 'overflow': 'hidden'
// }).find('.covers a').css({
// 'float': 'none',
// 'position': 'absolute',
// 'left': 1000
// });
//
// var setUpCovers = function() {
// var $covers = $('#featured-books .covers a');
//
// $covers.unbind('click mouseenter mouseleave');
//
// // Left image; scroll right (to view images on left).
// $covers.eq(0)
// .css('left', 0)
// .click(function(event) {
// $covers.eq(0).animate({'left': spacing}, 'fast');
// $covers.eq(1).animate({'left': spacing * 2}, 'fast');
// $covers.eq(2).animate({'left': spacing * 3}, 'fast');
// $covers.eq($covers.length - 1)
// .css('left', -spacing)
// .animate({'left': 0}, 'fast', function() {
// $(this).prependTo('#featured-books .covers');
// setUpCovers();
// });
//
// event.preventDefault();
// }).hover(function() {
// $leftRollover.appendTo(this).show();
// }, function() {
// $leftRollover.hide();
// });
//
// // Right image; scroll left (to view images on right).
// $covers.eq(2)
// .css('left', spacing * 2)
// .click(function(event) {
// $covers.eq(0)
// .animate({'left': -spacing}, 'fast', function() {
// $(this).appendTo('#featured-books .covers');
// setUpCovers();
// });
// $covers.eq(1).animate({'left': 0}, 'fast');
// $covers.eq(2).animate({'left': spacing}, 'fast');
// $covers.eq(3)
// .css('left', spacing * 3)
// .animate({'left': spacing * 2}, 'fast');
//
// event.preventDefault();
// }).hover(function() {
// $rightRollover.appendTo(this).show();
// }, function() {
// $rightRollover.hide();
// });
//
// // Center image; enlarge cover.
// $covers.eq(1)
// .css('left', spacing)
// .click(function(event) {
// $enlargedCover.attr('src', $(this).attr('href'))
// .css({
// 'left': ($('body').width() - 360) / 2,
// 'top' : 100,
// 'width': 360,
// 'height': 444
// })
// .show()
// .one('click', function() {
// $closeButton.unbind('click').hide();
// $enlargedCover.fadeOut();
// });
// $closeButton
// .css({
// 'left': ($('body').width() - 360) / 2,
// 'top' : 100
// })
// .show()
// .click(function() {
// $enlargedCover.click();
// });
// event.preventDefault();
// })
// .hover(function() {
// $enlargeRollover.appendTo(this).show();
// }, function() {
// $enlargeRollover.hide();
// });
// };
//
// setUpCovers();
// });
// Step 7
// $(document).ready(function() {
// var spacing = 140;
//
// function createControl(src) {
// return $('
')
// .attr('src', src)
// .addClass('control')
// .css('opacity', 0.6)
// .css('display', 'none');
// }
//
// var $leftRollover = createControl('images/left.gif');
// var $rightRollover = createControl('images/right.gif');
// var $enlargeRollover = createControl('images/enlarge.gif');
// var $enlargedCover = $('
')
// .addClass('enlarged')
// .hide()
// .appendTo('body');
// var $closeButton = createControl('images/close.gif')
// .addClass('enlarged-control')
// .appendTo('body');
// var $priceBadge = $('')
// .addClass('enlarged-price')
// .css('opacity', 0.6)
// .css('display', 'none')
// .appendTo('body');
//
// $('#featured-books').css({
// 'width': spacing * 3,
// 'height': '166px',
// 'overflow': 'hidden'
// }).find('.covers a').css({
// 'float': 'none',
// 'position': 'absolute',
// 'left': 1000
// });
//
// var setUpCovers = function() {
// var $covers = $('#featured-books .covers a');
//
// $covers.unbind('click mouseenter mouseleave');
//
// // Left image; scroll right (to view images on left).
// $covers.eq(0)
// .css('left', 0)
// .click(function(event) {
// $covers.eq(0).animate({'left': spacing}, 'fast');
// $covers.eq(1).animate({'left': spacing * 2}, 'fast');
// $covers.eq(2).animate({'left': spacing * 3}, 'fast');
// $covers.eq($covers.length - 1)
// .css('left', -spacing)
// .animate({'left': 0}, 'fast', function() {
// $(this).prependTo('#featured-books .covers');
// setUpCovers();
// });
//
// event.preventDefault();
// }).hover(function() {
// $leftRollover.appendTo(this).show();
// }, function() {
// $leftRollover.hide();
// });
//
// // Right image; scroll left (to view images on right).
// $covers.eq(2)
// .css('left', spacing * 2)
// .click(function(event) {
// $covers.eq(0)
// .animate({'left': -spacing}, 'fast', function() {
// $(this).appendTo('#featured-books .covers');
// setUpCovers();
// });
// $covers.eq(1).animate({'left': 0}, 'fast');
// $covers.eq(2).animate({'left': spacing}, 'fast');
// $covers.eq(3)
// .css('left', spacing * 3)
// .animate({'left': spacing * 2}, 'fast');
//
// event.preventDefault();
// }).hover(function() {
// $rightRollover.appendTo(this).show();
// }, function() {
// $rightRollover.hide();
// });
//
// // Center image; enlarge cover.
// $covers.eq(1)
// .css('left', spacing)
// .click(function(event) {
// var price = $(this).find('.price').text();
//
// $enlargedCover.attr('src', $(this).attr('href'))
// .css({
// 'left': ($('body').width() - 360) / 2,
// 'top' : 100,
// 'width': 360,
// 'height': 444
// })
// .show()
// .one('click', function() {
// $closeButton.unbind('click').hide();
// $priceBadge.hide();
// $enlargedCover.fadeOut();
// });
// $closeButton
// .css({
// 'left': ($('body').width() - 360) / 2,
// 'top' : 100
// })
// .show()
// .click(function() {
// $enlargedCover.click();
// });
// $priceBadge
// .css({
// 'right': ($('body').width() - 360) / 2,
// 'top' : 100
// })
// .text(price)
// .show();
//
// event.preventDefault();
// })
// .hover(function() {
// $enlargeRollover.appendTo(this).show();
// }, function() {
// $enlargeRollover.hide();
// });
// };
//
// setUpCovers();
// });
// Step 8
// $(document).ready(function() {
// var spacing = 140;
//
// function createControl(src) {
// return $('
')
// .attr('src', src)
// .addClass('control')
// .css('opacity', 0.6)
// .css('display', 'none');
// }
//
// var $leftRollover = createControl('images/left.gif');
// var $rightRollover = createControl('images/right.gif');
// var $enlargeRollover = createControl('images/enlarge.gif');
// var $enlargedCover = $('
')
// .addClass('enlarged')
// .hide()
// .appendTo('body');
// var $closeButton = createControl('images/close.gif')
// .addClass('enlarged-control')
// .appendTo('body');
// var $priceBadge = $('')
// .addClass('enlarged-price')
// .css('opacity', 0.6)
// .css('display', 'none')
// .appendTo('body');
//
// $('#featured-books').css({
// 'width': spacing * 3,
// 'height': '166px',
// 'overflow': 'hidden'
// }).find('.covers a').css({
// 'float': 'none',
// 'position': 'absolute',
// 'left': 1000
// });
//
// var setUpCovers = function() {
// var $covers = $('#featured-books .covers a');
//
// $covers.unbind('click mouseenter mouseleave');
//
// // Left image; scroll right (to view images on left).
// $covers.eq(0)
// .css('left', 0)
// .click(function(event) {
// $covers.eq(0).animate({'left': spacing}, 'fast');
// $covers.eq(1).animate({'left': spacing * 2}, 'fast');
// $covers.eq(2).animate({'left': spacing * 3}, 'fast');
// $covers.eq($covers.length - 1)
// .css('left', -spacing)
// .animate({'left': 0}, 'fast', function() {
// $(this).prependTo('#featured-books .covers');
// setUpCovers();
// });
//
// event.preventDefault();
// }).hover(function() {
// $leftRollover.appendTo(this).show();
// }, function() {
// $leftRollover.hide();
// });
//
// // Right image; scroll left (to view images on right).
// $covers.eq(2)
// .css('left', spacing * 2)
// .click(function(event) {
// $covers.eq(0)
// .animate({'left': -spacing}, 'fast', function() {
// $(this).appendTo('#featured-books .covers');
// setUpCovers();
// });
// $covers.eq(1).animate({'left': 0}, 'fast');
// $covers.eq(2).animate({'left': spacing}, 'fast');
// $covers.eq(3)
// .css('left', spacing * 3)
// .animate({'left': spacing * 2}, 'fast');
//
// event.preventDefault();
// }).hover(function() {
// $rightRollover.appendTo(this).show();
// }, function() {
// $rightRollover.hide();
// });
//
// // Center image; enlarge cover.
// $covers.eq(1)
// .css('left', spacing)
// .click(function(event) {
// var price = $(this).find('.price').text();
// var startPos = $(this).offset();
// startPos.width = $(this).width();
// startPos.height = $(this).height();
// var endPos = {};
// endPos.width = startPos.width * 3;
// endPos.height = startPos.height * 3;
// endPos.top = 100;
// endPos.left = ($('body').width() - endPos.width) / 2;
//
// $enlargedCover.attr('src', $(this).attr('href'))
// .css(startPos)
// .show()
// .animate(endPos, 'normal', function() {
// $enlargedCover
// .one('click', function() {
// $closeButton.unbind('click').hide();
// $priceBadge.hide();
// $enlargedCover.fadeOut();
// });
// $closeButton
// .css({
// 'left': endPos.left,
// 'top' : endPos.top
// })
// .show()
// .click(function() {
// $enlargedCover.click();
// });
// $priceBadge
// .css({
// 'right': endPos.left,
// 'top' : endPos.top
// })
// .text(price)
// .show();
// });
// event.preventDefault();
// })
// .hover(function() {
// $enlargeRollover.appendTo(this).show();
// }, function() {
// $enlargeRollover.hide();
// });
// };
//
// setUpCovers();
// });
// Step 9
// $(document).ready(function() {
// var spacing = 140;
//
// function createControl(src) {
// return $('
')
// .attr('src', src)
// .addClass('control')
// .css('opacity', 0.6)
// .css('display', 'none');
// }
//
// var $leftRollover = createControl('images/left.gif');
// var $rightRollover = createControl('images/right.gif');
// var $enlargeRollover = createControl('images/enlarge.gif');
// var $enlargedCover = $('
')
// .addClass('enlarged')
// .hide()
// .appendTo('body');
// var $closeButton = createControl('images/close.gif')
// .addClass('enlarged-control')
// .appendTo('body');
// var $priceBadge = $('')
// .addClass('enlarged-price')
// .css('opacity', 0.6)
// .css('display', 'none')
// .appendTo('body');
//
// $('#featured-books').css({
// 'width': spacing * 3,
// 'height': '166px',
// 'overflow': 'hidden'
// }).find('.covers a').css({
// 'float': 'none',
// 'position': 'absolute',
// 'left': 1000
// });
//
// var setUpCovers = function() {
// var $covers = $('#featured-books .covers a');
//
// $covers.unbind('click mouseenter mouseleave');
//
// // Left image; scroll right (to view images on left).
// $covers.eq(0)
// .css('left', 0)
// .click(function(event) {
// $covers.eq(0).animate({'left': spacing}, 'fast');
// $covers.eq(1).animate({'left': spacing * 2}, 'fast');
// $covers.eq(2).animate({'left': spacing * 3}, 'fast');
// $covers.eq($covers.length - 1)
// .css('left', -spacing)
// .animate({'left': 0}, 'fast', function() {
// $(this).prependTo('#featured-books .covers');
// setUpCovers();
// });
//
// event.preventDefault();
// }).hover(function() {
// $leftRollover.appendTo(this).show();
// }, function() {
// $leftRollover.hide();
// });
//
// // Right image; scroll left (to view images on right).
// $covers.eq(2)
// .css('left', spacing * 2)
// .click(function(event) {
// $covers.eq(0)
// .animate({'left': -spacing}, 'fast', function() {
// $(this).appendTo('#featured-books .covers');
// setUpCovers();
// });
// $covers.eq(1).animate({'left': 0}, 'fast');
// $covers.eq(2).animate({'left': spacing}, 'fast');
// $covers.eq(3)
// .css('left', spacing * 3)
// .animate({'left': spacing * 2}, 'fast');
//
// event.preventDefault();
// }).hover(function() {
// $rightRollover.appendTo(this).show();
// }, function() {
// $rightRollover.hide();
// });
//
// // Center image; enlarge cover.
// $covers.eq(1)
// .css('left', spacing)
// .click(function(event) {
// var price = $(this).find('.price').text();
// var startPos = $(this).offset();
// startPos.width = $(this).width();
// startPos.height = $(this).height();
// var endPos = {};
// endPos.width = startPos.width * 3;
// endPos.height = startPos.height * 3;
// endPos.top = 100;
// endPos.left = ($('body').width() - endPos.width) / 2;
//
// $enlargedCover.attr('src', $(this).attr('href'))
// .css(startPos)
// .show();
// var performAnimation = function() {
// $enlargedCover.animate(endPos, 'normal',
// function() {
// $enlargedCover.one('click', function() {
// $closeButton.unbind('click').hide();
// $priceBadge.hide();
// $enlargedCover.fadeOut();
// });
// $closeButton
// .css({
// 'left': endPos.left,
// 'top' : endPos.top
// })
// .show()
// .click(function() {
// $enlargedCover.click();
// });
// $priceBadge
// .css({
// 'right': endPos.left,
// 'top' : endPos.top
// })
// .text(price)
// .show();
// });
// };
// if ($enlargedCover[0].complete) {
// performAnimation();
// }
// else {
// $enlargedCover.bind('load', performAnimation);
// }
//
// event.preventDefault();
// })
// .hover(function() {
// $enlargeRollover.appendTo(this).show();
// }, function() {
// $enlargeRollover.hide();
// });
// };
//
// setUpCovers();
// });
// Step 10
$(document).ready(function() {
var spacing = 140;
function createControl(src) {
return $('
')
.attr('src', src)
.addClass('control')
.css('opacity', 0.6)
.css('display', 'none');
}
var $leftRollover = createControl('images/left.gif');
var $rightRollover = createControl('images/right.gif');
var $enlargeRollover = createControl('images/enlarge.gif');
var $enlargedCover = $('
')
.addClass('enlarged')
.hide()
.appendTo('body');
var $closeButton = createControl('images/close.gif')
.addClass('enlarged-control')
.appendTo('body');
var $priceBadge = $('')
.addClass('enlarged-price')
.css('opacity', 0.6)
.css('display', 'none')
.appendTo('body');
var $waitThrobber = $('
')
.attr('src', 'images/wait.gif')
.addClass('control')
.css('z-index', 4)
.hide();
$('#featured-books').css({
'width': spacing * 3,
'height': '166px',
'overflow': 'hidden'
}).find('.covers a').css({
'float': 'none',
'position': 'absolute',
'left': 1000
});
var setUpCovers = function() {
var $covers = $('#featured-books .covers a');
$covers.unbind('click mouseenter mouseleave');
// Left image; scroll right (to view images on left).
$covers.eq(0)
.css('left', 0)
.click(function(event) {
$covers.eq(0).animate({'left': spacing}, 'fast');
$covers.eq(1).animate({'left': spacing * 2}, 'fast');
$covers.eq(2).animate({'left': spacing * 3}, 'fast');
$covers.eq($covers.length - 1)
.css('left', -spacing)
.animate({'left': 0}, 'fast', function() {
$(this).prependTo('#featured-books .covers');
setUpCovers();
});
event.preventDefault();
}).hover(function() {
$leftRollover.appendTo(this).show();
}, function() {
$leftRollover.hide();
});
// Right image; scroll left (to view images on right).
$covers.eq(2)
.css('left', spacing * 2)
.click(function(event) {
$covers.eq(0)
.animate({'left': -spacing}, 'fast', function() {
$(this).appendTo('#featured-books .covers');
setUpCovers();
});
$covers.eq(1).animate({'left': 0}, 'fast');
$covers.eq(2).animate({'left': spacing}, 'fast');
$covers.eq(3)
.css('left', spacing * 3)
.animate({'left': spacing * 2}, 'fast');
event.preventDefault();
}).hover(function() {
$rightRollover.appendTo(this).show();
}, function() {
$rightRollover.hide();
});
// Center image; enlarge cover.
$covers.eq(1)
.css('left', spacing)
.click(function(event) {
$waitThrobber.appendTo(this).show();
var price = $(this).find('.price').text();
var startPos = $(this).offset();
startPos.width = $(this).width();
startPos.height = $(this).height();
var endPos = {};
endPos.width = startPos.width * 3;
endPos.height = startPos.height * 3;
endPos.top = 100;
endPos.left = ($('body').width() - endPos.width) / 2;
$enlargedCover.attr('src', $(this).attr('href'))
.css(startPos)
.show();
var performAnimation = function() {
$waitThrobber.hide();
$enlargedCover.animate(endPos, 'normal',
function() {
$enlargedCover.one('click', function() {
$closeButton.unbind('click').hide();
$priceBadge.hide();
$enlargedCover.fadeOut();
});
$closeButton
.css({
'left': endPos.left,
'top' : endPos.top
})
.show()
.click(function() {
$enlargedCover.click();
});
$priceBadge
.css({
'right': endPos.left,
'top' : endPos.top
})
.text(price)
.show();
});
};
if ($enlargedCover[0].complete) {
performAnimation();
}
else {
$enlargedCover.bind('load', performAnimation);
}
event.preventDefault();
})
.hover(function() {
$enlargeRollover.appendTo(this).show();
}, function() {
$enlargeRollover.hide();
});
};
setUpCovers();
});