fork download
copy 
  1. var imageURLArray = 
  2. 		new Array("birds.jpg", "dolphins.jpg", "elephant.jpg", "leopard.jpg", "pandas.jpg");
  3. var imgHolder;
  4. var nextPictureToShow;
  5. var refreshedIntervalId;
  6. var smallContainers;
  7.  
  8. $(document).ready(function()
  9. {
  10. 	var container = $('#smallPicsContainer');
  11. 	smallContainers = container.find('div.SmallPic');
  12. 	imgHolder = document.getElementById('currentPicture');
  13. 	nextPictureToShow = 0;
  14.  
  15. 	$(smallContainers).each(function(index)
  16. 	{
  17. 		$(this).mouseover(function()
  18. 		{
  19. 			$(this).addClass('HoveredPic');
  20. 		});
  21.  
  22. 		$(this).mouseout(function()	
  23. 		{	
  24. 			$(this).removeClass('HoveredPic');
  25. 		});
  26.  
  27. 		$(this).click(function()
  28. 		{
  29. 			ChangeRotatorPic(index);
  30. 		});
  31. 	}); 
  32.  
  33. 	$("#leftArrow button").click(function()
  34. 	{
  35. 		PreviousPicture();
  36. 	});
  37.  
  38. 	$("#rightArrow button").click(function()
  39. 	{
  40. 		NextPicture();
  41. 	});
  42.  
  43. 	StartRotator();
  44. }); 
  45.  
  46. function StartRotator()
  47. {
  48. 	refreshedIntervalId = window.setInterval("RotateImages()", 3500);
  49. }
  50.  
  51. function RotateImages()
  52. {
  53. 	var array = eval("imageURLArray");
  54. 	var container = eval("imgHolder");
  55. 	if (nextPictureToShow >= array.length)
  56. 	{
  57. 		nextPictureToShow = 0;
  58. 	}
  59. 	var urlToImg = "url(img/" + array[nextPictureToShow] + ")";
  60. 	$(container).css("background", urlToImg);
  61. 	$(container).css("backgroundRepeat", "no-repeat");
  62. 	$(container).css("backgroundPosition", "center");
  63. 	$(".SmallPic").removeClass('ClickedPic');
  64. 	$(".SmallPic").eq(nextPictureToShow).addClass('ClickedPic');
  65.  
  66. 	nextPictureToShow = nextPictureToShow + 1;
  67. }
  68.  
  69. function PreviousPicture()
  70. {
  71. 	if (nextPictureToShow == 0 || nextPictureToShow == 1) // next is 1, but current is 0, i.e "<" must point to the last one; 0 if it hasn't been incremented yet
  72. 	{
  73. 		nextPictureToShow = (imageURLArray.length) - 1;
  74. 	}
  75.  
  76. 	else
  77. 	{
  78. 		nextPictureToShow = nextPictureToShow - 2;
  79. 	}
  80.  
  81. 	clearInterval(refreshedIntervalId);
  82. 	RotateImages();
  83. 	StartRotator();
  84. }
  85.  
  86. function NextPicture()
  87. {
  88. 	if (nextPictureToShow == 0) // when page is loaded for the first time
  89. 	{
  90. 		nextPictureToShow = nextPictureToShow + 1;
  91. 	}
  92. 	clearInterval(refreshedIntervalId);
  93. 	RotateImages();	
  94. 	StartRotator();
  95. }
  96.  
  97. function ChangeRotatorPic(itemNumber)
  98. {
  99. 	nextPictureToShow = itemNumber;
  100. 	clearInterval(refreshedIntervalId);
  101. 	RotateImages();	
  102. 	StartRotator();
  103. }
Runtime error #stdin #stdout 0.34s 213696KB
comments (?)
stdin
copy 
Standard input is empty
stdout
copy 
Standard output is empty
https://ideone.com/g27vz
language:
JavaScript (rhino 1.7.9)
created:
11 years ago
visibility:
public

Share or Embed source code

Discover > Sphere Engine API

The brand new service which powers Ideone!

Discover > IDE Widget

Widget for compiling and running the source code in a web browser!