
//This file is used to load the carousel on the MTS home page.  Tried with JQuery a number of times but was getting IE6 grief with .append to the element.  This was an
//attempt at a quick alternative. - JT

// Note: that the images are loaded with 0 width and height, and get adjusted with the jquery statments at the end.  This is so the images dont all appear in IE
// the carousel hides them.
document.getElementById('carousel_list').innerHTML = '' + 
'<li class="1"><a href="http://manitobahomecoming2010.com/"><img class="carouselImg" src="/img/homepage/carousel/manitobaHomecoming_960x415.jpg" alt="Manitoba Homecoming" width="0" height="0" border="0" /></a></li>' + 
'<li class="2"><a href="/portal/site/mts/menuitem.a275cbc6dbb0d4e50e14081031248a0c/?vgnextoid=7592347a46da7210VgnVCM1000002a040f0aRCRD&vgnextchannel=1022fcb004e3e110VgnVCM1000002a040f0aRCRD"><img class="carouselImg" src="/img/homepage/carousel/freeWireless_960x415.gif" alt="Free Wireless Plan" width="0" height="0" border="0" /></a></li>' +
'<li class="3"><a href="/studentdeals"><img class="carouselImg" src="/img/homepage/carousel/studentDeals_Q32010-home.jpg" alt="Student Deals" width="0" height="0" border="0" /></a></li>' +
'<li class="4"><a href="/portal/site/mts/menuitem.a275cbc6dbb0d4e50e14081031248a0c/?vgnextoid=6b61110e03c1e110VgnVCM1000002a040f0aRCRD"><img class="carouselImg" src="/img/homepage/carousel/internetQ1_940x415.jpg" alt="Ultimate" width="0" height="0" border="0" /></a></li>' +
'<li class="5"><a href="/ultimatetv"><img class="carouselImg" src="/img/homepage/carousel/ultimateTV_960x415.jpg" alt="Ultimate TV" width="0" height="0" border="0" /></a></li>'
;

document.getElementById('carousel-nav').innerHTML = '' + 
  '<div id="button_list">' +
  '<p class="button"><a href="#" id="1" class="on"></a></p>' +
  '<p class="button"><a href="#" id="2" class="off"></a></p>' +
  '<p class="button"><a href="#" id="3" class="off"></a></p>' +
  '<p class="button"><a href="#" id="4" class="off"></a></p>' +
  '<p class="button"><a href="#" id="5" class="off"></a></p>' +
  '</div>'
;

$(function(){$('img.carouselImg').width(960);}); 
$(function(){$('img.carouselImg').height(415);}); 



