<?php


?><head>
<base href="http://stripesforthecure.com/" />
<title>Stripes for the Cure : Welcome</title>
<meta http-equiv="Content-Script-Type" content="text/javascript" />
<meta name="Keywords" content=" " />
<meta name="Description" content="" />
<link href="style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="ajaximage/scripts/jquery.min.js"></script>
<script type="text/javascript" src="ajaximage/scripts/jquery.form.js"></script>
<script type="text/javascript" >
 $(document).ready(function() { 
		
            $('#photoimg').live('change', function()			{ 
			           $("#preview").html('');
			    $("#preview").html('<img src="/loader.gif" alt="Uploading...."/>');
			$("#imageform").ajaxForm({
						target: '#preview'
		}).submit();
		
			});
        }); 
</script>
<script type="text/javascript">
        function readURL(input) {
            if (input.files && input.files[0]) {
                var reader = new FileReader();

                reader.onload = function (e) {
                    $('#blah').attr('src', e.target.result);
                     $('#blah2').attr('src', e.target.result);
                }

                reader.readAsDataURL(input.files[0]);
            }
        }
    </script>
<script type="text/javascript">
function updateTxt(field,toField){
var field = document.getElementById(field);
var toField = document.getElementById(toField);
toField.innerHTML=field.value;
}
</script>
<script type="text/javascript">

function theRotator() {
	//Set the opacity of all images to 0
	$('div.rotator ul li').css({opacity: 0.0});
	
	//Get the first image and display it (gets set to full opacity)
	$('div.rotator ul li:first').css({opacity: 1.0});
		
	//Call the rotator function to run the slideshow, 6000 = change to next image after 6 seconds
	
	setInterval('rotate()',6000);
	
}

function rotate() {	
	//Get the first image
	var current = ($('div.rotator ul li.show')?  $('div.rotator ul li.show') : $('div.rotator ul li:first'));

    if ( current.length == 0 ) current = $('div.rotator ul li:first');

	//Get next image, when it reaches the end, rotate it back to the first image
	var next = ((current.next().length) ? ((current.next().hasClass('show')) ? $('div.rotator ul li:first') :current.next()) : $('div.rotator ul li:first'));
	
	//Un-comment the 3 lines below to get the images in random order
	
	//var sibs = current.siblings();
        //var rndNum = Math.floor(Math.random() * sibs.length );
        //var next = $( sibs[ rndNum ] );
			

	//Set the fade in effect for the next image, the show class has higher z-index
	next.css({opacity: 0.0})
	.addClass('show')
	.animate({opacity: 1.0}, 1000);

	//Hide the current image
	current.animate({opacity: 0.0}, 1000)
	.removeClass('show');
	
};



$(document).ready(function() {		
	//Load the slideshow
	theRotator();
	$('div.rotator').fadeIn(1000);
    $('div.rotator ul li').fadeIn(1000); // tweek for IE
});

</script>
<script language='JavaScript' type='text/javascript'>

    function check_value(fieldvalue)
    {    
        switch(fieldvalue)
        {
            case 1:

                document.getElementById("imagedest").innerHTML = "<img src='images/web/white.png'> <div id='location3'> <?php echo $location; ?></div>";
                    break;

            case 2:

                document.getElementById("imagedest").innerHTML = "<img src='images/web/pink.png'> <div id='location3'> <?php echo $location; ?></div>"; 
                    break;

            case 3:

                document.getElementById("imagedest").innerHTML = "<img src='images/web/blank.png'>"; 
                    break;
                    
            case 4:

                document.getElementById("imagedest").innerHTML = "<img src='images/web/white.png'>"; 
                    break;       
                    
                    case 5:

                document.getElementById("imagedest1").innerHTML = "<img src='images/web/Logo.png'>";
                    break;

            case 6:

                document.getElementById("imagedest1").innerHTML = "<img src='images/web/Race.png'>"; 
                    break;

            case 7:

                document.getElementById("imagedest1").innerHTML = "<img src='images/web/ribbon.png'>"; 
                    break;
                    
            case 8:

                document.getElementById("imagedest1").innerHTML = "<img src='images/web/passionate.png'>"; 
                    break; 
            case 9:

                document.getElementById("imagedest1").innerHTML = "<img id='blah' src='#' alt='your custom image' height='357'/> "; 
                    break;         

            case 10:

                document.getElementById("imagedest2").innerHTML = "<img src='images/web/race_dallas.png'>"; 
                    break;

            case 11:

                document.getElementById("imagedest2").innerHTML = "<img src='images/web/race_denver.png'>"; 
                    break;
        }
    }
    
</script>
<meta name="CnvHeaderVersion" content="v5.0" />
</head>
<?php
$location = $_GET["loc"];

?>



<div id="container">
<div id="header">
  <div id="logo"> <img src="images/sgk-logo_top.png" alt="susan g kolman logo"  />
    <div id="location1"> <?php echo $location; ?></div>
  </div>
  <div id="menu"> <a href="/index.php">Home</a> &nbsp; |	&nbsp; <a href="/about.php">About</a> &nbsp; | 	&nbsp;<a href="/faq.php">FAQ</a> &nbsp; |	&nbsp; <a href="/contact.php">Contact</a> </div>
  <div id="banner"> <img src="images/banner.png" alt="Stripes"  /> 
    <!-- img src="images/20th_anniversary_logo.jpg" alt="20th anniversary logo"  / -->
    <div class="rotator">
      <ul>
        <li class="show"> <a href="javascript:void(0)"> <img src="images/racepics/img2.jpg" width="200" height="150"  alt="pic1" /> </a> </li>
        <li> <a href="javascript:void(0)"> <img src="images/racepics/img3.jpg" width="200" height="150"  alt="pic2" /> </a> </li>
        <li> <a href="javascript:void(0)"> <img src="images/racepics/img5.jpg" width="200" height="150"  alt="pic3" /> </a> </li>
        <li> <a href="javascript:void(0)"> <img src="images/racepics/img6.jpg" width="200" height="150"  alt="pic4" /> </a> </li>
        <li> <a href="javascript:void(0)"> <img src="images/racepics/img8.jpg" width="200" height="150"  alt="pic6" /> </a> </li>
        <li> <a href="javascript:void(0)"> <img src="images/racepics/img10.jpg" width="200" height="150"  alt="pic8" /> </a> </li>
        <li> <a href="javascript:void(0)"> <img src="images/racepics/img10b.jpg" width="200" height="150"  alt="pic9" /> </a> </li>
        <li> <a href="javascript:void(0)"> <img src="images/racepics/img12.png" width="200" height="150"  alt="pic10" /> </a> </li>
      </ul>
    </div>
  </div>
  <div id="location"> <?php echo $location; ?></div>
</div>
