I'm working on my assignment for my introductory class into php and my conditional all appear to be working as I hoped with the exception of the background conditional which I think is being overridden by the bg.js script.
My goal is that depending on the day of the week, a different background will display based on that day as the 'default' background. However the same background always appears regardless of the day - i have a different little poster that displays depending on the day of the week and that is working correctly. Hopefully someone can help me to solve this - I like how the effects and everything in this template work and it will work well for my overall class in php I think - but i'd like to get it working exactly as I'd hoped.
So to clearly define the problem: the background image at first load always displays as 'image/bg_img01.jpg'. As I envisioned the project, today at first load, the background image ought to be Tuesday's image which is 'image/bg_img03.jpg'. I think i have a javascript conflict that is pugging the other image image in - i've looked at the JS but haven't been able to figure out how to correct it.
URL to BG.js Script (Which I think is the culprit)
SITE/URL a3_Dates-Conditionals
<?php
/*
* a3_Dates-Conditionals.php
*
* Create a page with the following functionality:
* Use PHP to deliver a different image and bit of content
* for each weekday (Sunday to Saturday) using one PHP file.
*
* STAGE1 - Build it static (check)
* STAGE2 - build with variables (test, check)
* STAGE3 - Build with conditionals
*/
//http://us1.php.net/manual/en/function.date.php
$today = date("D, M j");
$test = "text";
//http://www.php.net/manual/en/control-structures.switch.php
$strSun = ' ';
$strMon = ' ';
$strTues = ' ';
$strWeds = ' ';
$strThurs = ' ';
$strFri = ' ';
$strSat = ' ';
$linkSun = 'bg_img01.jpg';
$linkMon = 'bg_img02.jpg';
$linkTues = 'bg_img03.jpg';
$linkWeds = 'bg_img04.jpg';
$linkThurs = 'bg_img05.jpg';
$linkFri = 'bg_img06.jpg';
$linkSat = 'bg_img07.jpg';
$linkPoster = '';
switch (date('N')) {
case 0:
$strSun = 'class="current"';
$todayIs = 'Sunday';
$linkSun = "bg_imgSpecial.jpg";
$linkPoster = 'img_poster-01.jpg';
break;
case 1:
$strMon = 'class="current"';
$todayIs = 'Monday';
$linkMon = "bg_imgSpecial.jpg";
$linkPoster = 'img_poster-02.jpg';
break;
case 2:
$strTues = 'class="current"';
$todayIs = 'Tuesday';
$linkTues = "bg_imgSpecial.jpg";
$linkPoster = 'img_poster-03.jpg';
break;
case 3:
$strWeds = 'class="current"';
$todayIs = 'New Comic book Day!';
$linkWeds = "bg_imgComicBooks.jpg";
$linkPoster = 'img_poster-04.jpg';
break;
case 4:
$strThurs = 'class="current"';
$todayIs = 'Thursday';
$linkThurs = "bg_imgSpecial.jpg";
$linkPoster = 'img_poster-05.jpg';
break;
case 5:
$strFri = 'class="current"';
$todayIs = 'Friday';
$linkFri = "bg_imgSpecial.jpg";
$linkPoster = 'img_poster-06.jpg';
break;
case 6:
$strSat = 'class="current"';
$todayIs = 'Saturday';
$linkSat = "bg_imgSpecial.jpg";
$linkPoster = 'img_poster-07.jpg';
break;
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<title>a3 | itc240 (w14)</title>
<meta charset="utf-8">
<link rel="stylesheet" href="css/reset.css" type="text/css" media="all">
<link rel="stylesheet" href="css/layout.css" type="text/css" media="all">
<link rel="stylesheet" href="css/prettyPhoto.css" type="text/css" media="all">
<link rel="stylesheet" href="css/style.css" type="text/css" media="all">
<script type="text/javascript" src="js/jquery-1.6.js" ></script>
<script type="text/javascript" src="js/cufon-yui.js"></script>
<script type="text/javascript" src="js/cufon-replace.js"></script>
<script type="text/javascript" src="js/Ubuntu_400.font.js"></script>
<script type="text/javascript" src="js/Ubuntu_700.font.js"></script>
<script type="text/javascript" src="js/bgSlider.js" ></script>
<script type="text/javascript" src="js/script.js" ></script>
<script type="text/javascript" src="js/pages.js"></script>
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="js/bg.js" ></script>
<script type="text/javascript" src="js/tabs.js"></script>
<script type="text/javascript" src="js/jquery.prettyPhoto.js"></script>
<!--[if lt IE 9]>
<script type="text/javascript" src="js/html5.js"></script>
<![endif]-->
<!--[if lt IE 7]>
<div style='clear:both;text-align:center;position:relative'>
<a href="http://www.microsoft.com/windows/internet-explorer/default.aspx?ocid=ie6_countdown_bannercode"><img src="http://storage.ie6countdown.com/assets/100/images/banners/warning_bar_0000_us.jpg" border="0" alt="" /></a>
</div>
<![endif]-->
</head>
<body id="page1">
<div class="spinner"></div>
<div id="bgSlider"></div>
<div class="extra">
<div class="main">
<div class="box">
<!-- header -->
<header>
<h1><a href="index.html" id="logo">Max | <sup>itc</sup>240</a></h1>
<nav>
<ul id="menu">
<li><a href="#"><span></span> <strong><?=$today;?></strong></a></li>
<li><a href="#"><span></span> <strong><?=$todayIs;?></strong></a></li>
<li>
<br >
<img src="images/<?=$linkPoster;?>" alt="">
</li>
</ul>
</nav>
</header>
<!--content -->
<article id="content">
<div class="ic"><!--Content Here... --></div>
</article id="content">
<!-- / content -->
</div>
</div>
<div class="block"></div>
</div>
<div class="bg1">
<div class="main">
<!-- footer -->
<footer>
<div class="bg_spinner"></div>
<ul class="pagination">
<li <?=$strSun;?> ><a href="images/<?=$linkSun;?>">S</a></li>
<li <?=$strMon;?> ><a href="images/<?=$linkMon;?>">M</a></li>
<li <?=$strTues;?> ><a href="images/<?=$linkTues;?>">T</a></li>
<li <?=$strWeds;?> ><a href="images/<?=$linkWeds;?>">W</a></li>
<li <?=$strThurs;?> ><a href="images/<?=$linkThurs;?>">Th</a></li>
<li <?=$strFri;?> ><a href="images/<?=$linkFri;?>">F</a></li>
<li <?=$strSat;?> ><a href="images/<?=$linkSat;?>">S</a></li>
</ul>
<div class="col_1">
<a href="index.html" id="footer_logo">ZZZ</a> @ 2011
</div>
<div class="col_2">
Designed by <a rel="nofollow" href="http://www.max-o-matic.com/" target="_blank">max-o-matic.com</a>
<!-- {%FOOTER_LINK} -->
</div>
</footer>
<!-- / footer-->
</div>
</div>
<script type="text/javascript"> Cufon.now(); </script>
<script>
$(window).load(function() {
$('.spinner').fadeOut();
$('body').css({overflow:'inherit'})
})
</script>
</body>
</html>
As always any and all help is greatly appreciated. Thank you
Don't have enough reputation to comment ;-( But, I think you also have a problem the the date('N'). As per the documentation, the value is 1 (Monday to 7 (Sunday) http://ca1.php.net/manual/en/function.date.php