Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > Javascript > iTunes Music Store "New Releases" Javascript

Reply
Thread Tools

iTunes Music Store "New Releases" Javascript

 
 
mstearne@gmail.com
Guest
Posts: n/a
 
      02-24-2006
Has anyone seen any Javascript that mimics the effect that allows you
to browse through the New Releases, Just Added sections of the iTunes
Music Store? Where you click the arrow icon and the next 4 albums are
shown.

Example: http://imac2.taxrecords.com/mstearne/misc/Picture3.png

Thanks,
Michael

 
Reply With Quote
 
 
 
 
RobG
Guest
Posts: n/a
 
      02-24-2006
http://www.velocityreviews.com/forums/(E-Mail Removed) wrote:
> Has anyone seen any Javascript that mimics the effect that allows you
> to browse through the New Releases, Just Added sections of the iTunes
> Music Store? Where you click the arrow icon and the next 4 albums are
> shown.
>
> Example: http://imac2.taxrecords.com/mstearne/misc/Picture3.png


Here's a simple example I wrote some time ago - needs feature detection
added. If you want to scroll more than one at a time, call it from a loop.

It could be far more sophisticated, or use an array of images and fixed
set of thumb frames - how many ways can you skin a cat. I like this one
'cos it's simple.

If scriptless fallback is required:

- have #thumbBox height and width unset by default, set
using script as page loads (modify the style rule is best)

- hide the left/right buttons by default and show using script, it
can be done at the same time the #thumbBox rule properties
are modified.



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Scrolling thumbs example</title>
<meta http-equiv="Content-Type"
content="text/html; charset=ISO-8859-1">

<style type="text/css">
#thumbBox {
border: 3px solid #FF9900;
width: 6em;
height: 2em;
overflow: hidden;
position: relative;
}
.thumb {
float: left;
width: 2em;
height: 2em;
font-weight: bold;
text-align: center;
line-height: 2em;
}
.c0 {background-color: #f00;}
.c1 {background-color: #00f;}
.c2 {background-color: #0f0;}
.c3 {background-color: #ff0;}
.c4 {background-color: #0ff;}
.c5 {background-color: #f0f;}
.c6 {background-color: #f9f;}
</style>

</head>
<body>

<h1>Demonstration of scrolling thumbnails</h1>

<script type="text/javascript">
function move(id, way)
{
var box = document.getElementById(id);
var thumbs = box.getElementsByTagName('div');
if ('left' == way) {
box.insertBefore(thumbs[thumbs.length-1],thumbs[0]);
} else {
box.appendChild(thumbs[0]);
}
}
</script>

<div>
<input type="button" value="&lt;&lt;Left"
onclick="move('thumbBox','left');">
<input type="button" value="Right&gt;&gt;"
onclick="move('thumbBox','right');">
</div>

<div id="thumbBox">
<div class="thumb c0">1</div>
<div class="thumb c1">2</div>
<div class="thumb c2">3</div>
<div class="thumb c3">4</div>
<div class="thumb c4">5</div>
<div class="thumb c5">6</div>
<div class="thumb c6">7</div>
</div>

</body>
</html>



--
Rob
 
Reply With Quote
 
 
 
 
mstearne@gmail.com
Guest
Posts: n/a
 
      02-24-2006
Thanks!

 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Apple Itunes - "Accessing Itunes Store" hangs Richard Fangnail Computer Support 2 12-08-2007 06:51 PM
moving limewire music to my itunes library jenann50@hotmail.com Python 2 10-02-2006 08:28 PM
Apple iTunes Music Store Derek Janssen DVD Video 0 09-12-2006 07:35 PM
itunes music store ads on telly? dmbkiwi@gmail.com NZ Computing 10 03-06-2006 02:08 AM
Block iTunes music sharing internally jdover@gmail.com Cisco 0 09-01-2005 08:27 PM



Advertisments