需要帮助使用JAVASCRIPT切换标题图像

时间:2011-03-07 16:38:05

标签: javascript

我正在为tumblr页面进行动态布局。到目前为止,我已经成功地为css样式表做了一个时间敏感的开关,但现在我也要切换横幅。

我掀起了一些代码(javascript)来执行此操作,但不断收到错误并且不知道原因。我也不确定准确放置代码的位置。由于这是一个tumblr布局,标题位于开始标记的正下方。所以我不确定我是否应该在那里放置javascript,或者我应该将它放在标签下面

这是我提出的代码。它在DW中给我一个语法错误,但由于我是新手,我不知道问题是什么。

    <script type="text/JavaScript">
<!--
function getHeader() {

 if (7 <= currentTime&&currentTime < 18) {
       document.write("<h1><a href="/"><img src="http://itsnotch.com/tumblr/images/NotchTheGuru_VCbanner.jpg" border "0" /></a></h1>");
      }

       else {
       document.write(" <h1><a href="/"><img src="http://itsnotch.com/tumblr/images/NotchTheGuru_Banner.jpg" border "0" /></a></h1>");
      }

}

getHeader();
-->
</script>

它在'document.write'行上给出了一个错误。

以下是该页面的完整源代码,可让您更好地了解我正在做的事情

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>


  <meta name="description" content="Big Notch, Notch the Guru, Notch Blog, Notch's Blog, Word of Notch" />



        <!-- DEFAULT SETTINGS -->

        <meta name="font:Title" content="Arial" />
        <meta name="font:Body" content="Lucida Sans" />
        <meta name="text:Disqus Shortname" content="" />

        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <title>{block:SearchPage}Search results for "{SearchQuery}" - {/block:SearchPage}{block:PostSummary}{PostSummary} - {/block:PostSummary}{Title}</title>
        <link rel="icon" href="{Favicon}"/>
        <link rel="alternate" type="application/rss+xml" title="RSS" href="{RSS}"/>
        <meta name="viewport" content="width=850"/> <!-- iPhone -->







        <!--[if lt IE 7]>
            <style type="text/css">
                .post div.labels {
                    right: 450px;
                }
            </style>
        <![endif]-->



<!--Google Tracker Code--->

<script type="text/javascript">

  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-19744657-4']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();

</script>



    </head>
    <body>

<!--SCM Music Player by Adrian Shum - http://scmplayer.asweb.info-->
<script type='text/javascript'><!--
document.write(unescape('%3C%73%63%72%69%70%74%20%74%79%70%65%3D%22%74%65%78%74%2F%6A%61%76%61%73%63%72%69%70%74%22%20%73%72%63%3D%22%68%74%74%70%3A%2F%2F%73%63%6D%70%6C%61%79%65%72%2E%61%73%77%65%62%2E%69%6E%66%6F%2F%73%63%72%69%70%74%2E%6A%73%22%20%3E%3C%2F%73%63%72%69%70%74%3E'));
//--></script>
<script type="text/javascript"><!--
SCMMusicPlayer.init("{'skin':'skins/cyber/skin.css','playback':{'autostart':'true','shuffle':'true','volume':'70'},'playlist':[{'title':'BattleCat Instrumental Loop','url':'http://itsnotch.com/music/BattleCat%20Instrumental(loop).mp3'},{'title':'Curren$y - Skybourne','url':'http://itsnotch.com/music/skybourne.mp3'},{'title':'Dam-Funk','url':'http://itsnotch.com/music/10_west.mp3'},{'title':'Curren$y - Flight Briefing','url':'http://itsnotch.com/music/FlightBriefing.mp3'},{'title':'B-Ducey - Let Me Be (prod.by Big Notch)','url':'http://itsnotch.com/music/Let%20me%20be.mp3'},{'title':'Vado - Council Music (looped by Big Notch)','url':'http://itsnotch.com/music/Council%20Music%20(Instrumental).mp3'},{'title':'Snoop Dogg - No Bitch','url':'http://itsnotch.com/music/No_Bitch.mp3'},{'title':'Little Brother - That Aint No Love','url':'http://itsnotch.com/music/LittleBrother.mp3'}],'placement':'bottom','showplaylist':'false'}");
//--></script>
<!--End of SCM Music Player script-->

        <div id="content">


            <div id="description">
                <div>
                                        <div id="search">
                                            <form action="/search" method="get">
                                                <input type="text" name="q" value="{SearchQuery}"/>
                                                <input type="submit" value="Search"/>
                                            </form>
                                        </div>

                    {Description}

                    <p id="nav_container">
                        <a href="/archive" id="archive_link">Archive</a>
                        <span class="dim">/</span>
                        <a href="{RSS}">RSS</a>
                    </p>
                </div>
            </div>

                        {block:SearchPage}
                        <div id="searchresultcount">
                            <p>Your search for <span class="query">{SearchQuery}</span> returned {SearchResultCount} result(s).</p>
                        </div>
                        {/block:SearchPage}

            {block:Posts}
                <div class="post">
                    <div class="labels">
                        {block:NewDayDate}
                            <div class="date"><a href="{Permalink}">{Month} {DayOfMonth}</a></div>
                        {/block:NewDayDate}

                        {block:SameDayDate}
                            <div class="date"><a href="{Permalink}"></a></div>
                        {/block:SameDayDate}   

                    </div>

                    {block:Regular}
                        <div class="regular">
                            {block:Title}<h2><a href="{Permalink}">{Title}</a></h2>{/block:Title}
                            {Body}
                        </div>
<div id="separator"></div>  

                    {/block:Regular}

                    {block:Photo}
                        <div class="photo">
                            {LinkOpenTag}<img src="{PhotoURL-400}" alt="{PhotoAlt}"/>{LinkCloseTag}
                            {block:Caption}
                                <div class="caption">{Caption}</div>
                            {/block:Caption} 
                        </div>
<div id="separator"></div>  

                    {/block:Photo}
                    {block:Quote}
                        <div class="quote">
                            <span class="quote">
                                <big class="quote">&#147;</big> {Quote}
                            </span>
                            {block:Source}<span class="source">{Source}</span>{/block:Source}
                        </div>
<div id="separator"></div>  

                    {/block:Quote}

                    {block:Link}
                        <div class="link">
                            <a href="{URL}" class="link" {Target}>{Name}</a>
                            {block:Description}
                                <span class="description">{Description}</span>
                            {/block:Description}
                        </div>
<div id="separator"></div>  

                    {/block:Link}

                    {block:Conversation}
                        <div class="conversation">
                            {block:Title}<h2><a href="{Permalink}">{Title}</a></h2>{/block:Title}
                            <ul>
                                {block:Lines}
                                    <li>
                                        {block:Label}<span class="label">{Label}</span>{/block:Label}
                                        {Line}
                                    </li>
                                {/block:Lines}
                            </ul>
                        </div>
<div id="separator"></div>  

                    {/block:Conversation}

                    {block:Audio}
                        <div class="audio">
                            {AudioPlayerGrey}
                            {block:Caption}
                                <div class="caption">{Caption}</div>
                            {/block:Caption}
                        </div>
<div id="separator"></div>  

                    {/block:Audio}

                    {block:Video}
                        <div class="video">
                            {Video-400}
                            {block:Caption}
                                <div class="caption">{Caption}</div>
                            {/block:Caption}
                        </div>
<div id="separator"></div>  

                    {/block:Video}
                </div>

                {block:IfDisqusShortname}
                    {block:Permalink}
                        <div id="disqus_thread"></div>
                        <script type="text/javascript" src="http://disqus.com/forums/{text:Disqus Shortname}/embed.js"></script>
                        <noscript><a href="http://{text:Disqus Shortname}.disqus.com/?url=ref">View the discussion thread.</a></noscript>

                        <div style="text-align: right; margin-top: 5px">
                            <a href="http://disqus.com" class="dsq-brlink">blog comments powered by <span class="logo-disqus">Disqus</span></a>
                        </div>
                    {/block:Permalink}
                {/block:IfDisqusShortname}
            {/block:Posts}

            <div id="footer">
                {block:PreviousPage}
                    <a href="{PreviousPage}">&#171; Previous</a> &nbsp;&nbsp;
                {/block:PreviousPage}

                {block:NextPage}
                    <a href="{NextPage}">Next &#187;</a>
                {/block:NextPage}
            </div>
        </div>

        {block:IfDisqusShortname}
            <script type="text/javascript">
                //<![CDATA[
                (function() {
                    var links = document.getElementsByTagName('a');
                    var query = '?';
                    for(var i = 0; i < links.length; i++) {
                        if(links[i].href.indexOf('#disqus_thread') >= 0) {
                            query += 'url' + i + '=' + encodeURIComponent(links[i].href) + '&';
                        }
                    }
                    document.write('<script charset="utf-8" type="text/javascript" src="http://disqus.com/forums/{text:Disqus Shortname}/get_num_replies.js' + query + '"></' + 'script>');
                })();
                //]]>
            </script>
        {/block:IfDisqusShortname}

<script type="text/JavaScript">
<!--
function getStylesheet() {
      var currentTime = new Date().getHours();
      if (22 <= currentTime&&currentTime < 7) {
       document.write("<link rel='stylesheet' href='http://itsnotch.com/tumblr/files/nighttime.css' type='text/css'>");
      }
      if (7 <= currentTime&&currentTime < 18) {
       document.write("<link rel='stylesheet' href='http://itsnotch.com/tumblr/files/vice.css' type='text/css'>");
      }
      if (18 <= currentTime&&currentTime < 20) {
       document.write("<link rel='stylesheet' href='http://itsnotch.com/tumblr/files/evening.css' type='text/css'>");
      }
      if (20 <= currentTime&&currentTime < 22) {
       document.write("<link rel='stylesheet' href='http://itsnotch.com/tumblr/files/dusk.css' type='text/css'>");
      }

}

getStylesheet();
-->
</script>

<noscript><<link rel="stylesheet" type="text/css" href="http://itsnotch.com/tumblr/files/dusk.css" /></noscript>



<script type="text/JavaScript">
<!--
function getHeader() {

 if (7 <= currentTime&&currentTime < 18) {
       document.write("<h1><a href="/"><img src="http://itsnotch.com/tumblr/images/NotchTheGuru_VCbanner.jpg" border "0" /></a></h1>");
      }

       else {
       document.write(" <h1><a href="/"><img src="http://itsnotch.com/tumblr/images/NotchTheGuru_Banner.jpg" border "0" /></a></h1>");
      }

}

getHeader();
-->
</script>

    </body>
</html>

标题最初发布在''标记

下方

1 个答案:

答案 0 :(得分:0)

  • 不要嵌套双引号
  • 评论结束评论// - &gt;
  • 当前时间需要是全局变量

这是一些代码

<script type="text/javascript">  
var currentTime = new Date().getHours(); 
function getStylesheet() {
  var css = "dusk.css"; // default
  if (22 <= currentTime&&currentTime < 7) css = "nighttime.css";
  else if (7 <= currentTime&&currentTime < 18) css = "vice.css";
  else if (18 <= currentTime&&currentTime < 20) css = "evening.css";
  document.write('<link rel="stylesheet" href="http://itsnotch.com/tumblr/files/'+css+'" type="text/css">');
}
getStylesheet();
function getHeader() {    
  var img = "http://itsnotch.com/tumblr/images/";
  img += (7 <= currentTime && currentTime < 18) ? "NotchTheGuru_VCbanner.jpg" : "NotchTheGuru_Banner.jpg";      
  document.write('<h1><a href="/"><img src="'+img+'" border "0" /></a></h1>');  
}      
getHeader();    
</script>
<noscript>
<link rel="stylesheet" type="text/css" href="http://itsnotch.com/tumblr/files/dusk.css" />
<h1><a href="/"><img src="http://itsnotch.com/tumblr/images/NotchTheGuru_Banner.jpg" border "0" /></a>
</noscript>