Booking.com

I just made a bit modification to the original Google AJAX GFSlideShow API and now it supports the random option. You may refer to this blog post if you have no idea what's this API about. Here is an example of how this random option works.

Loading...


The above example presents a slideshow that display the numbers 0 to 9 in a random order. Whenever you refresh this blog page, the numbers will be displayed in a new different order.

To implement this random option, take the following steps.

Step 1 – point your script source in the HTML header to the following location, instead of the one from 'http://www.google.com/uds/solutions/slideshow/gfslideshow.js', or you may download the script and host it in your own server.
...<head>
<!--gfslideadd-on START-->
<script src='http://www.google.com/jsapi' type='text/javascript'/>
<script src='http://chiwawah.web.fc2.com/gfslideshow/gfslideshow.js' type='text/javascript'/>
<!--gfslideadd-on END-->
<b:include data='blog' name='all-head-content'/>...



Step 2 – add 'random : true' to the options variable, as in the following example.
<style type="text/css">
.gss a img {border:none; padding:0;}
.gss img {border:none; padding:0;}
.gss {
width: 213px;
height: 142px;
color: #dddddd;
background-color: #cccccc;
padding: 1px;
}
</style>
<script type="text/javascript">
function load() {
var samples = "http://photos.googleapis.com/data/feed/base/user/youralbum?kind=photo&alt=rss&tag=eg_tag";
var options = {
displayTime: 2000,
transistionTime: 600,
numResults : 10,
random : true,
scaleImages : true};
new GFslideShow(samples, "slideshow", options);
}
google.load("feeds", "1");
google.setOnLoadCallback(load);
</script>
<div id="slideshow" class="gss">Loading...</div>


That is. Hope you'll enjoy.