Question

如果您对javascript和doctype声明之间的关系有经验，那么任何帮助都将不胜感激。我使用wordpress，我试图将光标脚本包含在页面中。该脚本在没有默认wordpress doctype的情况下工作 - 它没有。有关如何使光标脚本工作的任何建议吗？

我的WordPress的HTML doctype声明：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

游标代码：

<STYLE type="text/css">
    <!--
    .kisser {
      position:absolute;
      top:0;
      left:0;
      visibility:hidden;
    }
    -->
    </STYLE>

    <SCRIPT language="JavaScript1.2" type="text/JavaScript">
    <!-- cloak

    //Kissing trail
    //Visit http://www.rainbow.arch.scriptmania.com for this script

    kisserCount = 15 //maximum number of images on screen at one time
    curKisser = 0 //the last image DIV to be displayed (used for timer)
    kissDelay = 1200 //duration images stay on screen (in milliseconds)
    kissSpacer = 30 //distance to move mouse b4 next heart appears
    theimage = "cur.png" //the 1st image to be displayed
    theimage2 = "small_heart.gif" //the 2nd image to be displayed



    //Browser checking and syntax variables
    var docLayers = (document.layers) ? true:false;
    var docId = (document.getElementById) ? true:false;
    var docAll = (document.all) ? true:false;
    var docbitK = (docLayers) ? "document.layers['":(docId) ? "document.getElementById('":(docAll) ? "document.all['":"document."
    var docbitendK = (docLayers) ? "']":(docId) ? "')":(docAll) ? "']":""
    var stylebitK = (docLayers) ? "":".style"
    var showbitK = (docLayers) ? "show":"visible"
    var hidebitK = (docLayers) ? "hide":"hidden"
    var ns6=document.getElementById&&!document.all
    //Variables used in script
    var posX, posY, lastX, lastY, kisserCount, curKisser, kissDelay, kissSpacer, theimage
    lastX = 0
    lastY = 0
    //Collection of functions to get mouse position and place the images
    function doKisser(e) {

      posX = getMouseXPos(e)
      posY = getMouseYPos(e)
      if (posX>(lastX+kissSpacer)||posX<(lastX-kissSpacer)||posY>(lastY+kissSpacer)||posY<(lastY-kissSpacer)) {
        showKisser(posX,posY)
        lastX = posX
        lastY = posY
      }
    }
    // Get the horizontal position of the mouse
    function getMouseXPos(e) {
      if (document.layers||ns6) {
        return parseInt(e.pageX+10)
      } else {
        return (parseInt(event.clientX+10) + parseInt(document.body.scrollLeft))
      }
    }
    // Get the vartical position of the mouse
    function getMouseYPos(e) {
      if (document.layers||ns6) {
        return parseInt(e.pageY)
      } else {
        return (parseInt(event.clientY) + parseInt(document.body.scrollTop))
      }
    }
    //Place the image and start timer so that it disappears after a period of time
    function showKisser(x,y) {
      var processedx=ns6? Math.min(x,window.innerWidth-75) : docAll? Math.min(x,document.body.clientWidth-55) : x
      if (curKisser >= kisserCount) {curKisser = 0}
      eval(docbitK + "kisser" + curKisser + docbitendK + stylebitK + ".left = " + processedx)
      eval(docbitK + "kisser" + curKisser + docbitendK + stylebitK + ".top = " + y)
      eval(docbitK + "kisser" + curKisser + docbitendK + stylebitK + ".visibility = '" + showbitK + "'")
      if (eval("typeof(kissDelay" + curKisser + ")")=="number") {
        eval("clearTimeout(kissDelay" + curKisser + ")")
      }
      eval("kissDelay" + curKisser + " = setTimeout('hideKisser(" + curKisser + ")',kissDelay)")
      curKisser += 1
    }
    //Make the image disappear
    function hideKisser(knum) {
      eval(docbitK + "kisser" + knum + docbitendK + stylebitK + ".visibility = '" + hidebitK + "'")
    }

    function kissbegin(){
    //Let the browser know when the mouse moves
    if (docLayers) {
      document.captureEvents(Event.MOUSEMOVE)
      document.onMouseMove = doKisser
    } else {
      document.onmousemove = doKisser
    }
    }
    window.onload=kissbegin
    // decloak -->
    </SCRIPT>


    <!--Simply copy and paste just before </BODY> section of your page.-->

    <SCRIPT language="JavaScript" type="text/JavaScript">
    <!-- cloak
    // Add all DIV's of hearts
    if (document.all||document.getElementById||document.layers){
    for (k=0;k<kisserCount;k=k+2) {
      document.write('<div id="kisser' + k + '" class="kisser"><img src="' + theimage + '" alt="" border="0"></div>\n')
      document.write('<div id="kisser' + (k+1) + '" class="kisser"><img src="' + theimage2 + '" alt="" border="0"></div>\n')

    }
    }

    // decloak -->
    </SCRIPT>

Answer 1

该脚本充斥着非常旧的浏览器检测代码，这可能会导致它在更新的浏览器中以更严格的DOCTYPE中断。

尝试删除脚本代码中的'language =“JavaScript1.2”'。如果这不起作用，则必须重写浏览器检测。

实际的脚本并不是很复杂，但也许您可以在其他地方找到它们并将它们组合起来。你需要做两件事：

隐藏光标（使用CSS完成）
获取鼠标位置并将自己的光标放在那里（通常是图像）。为此，您需要一个获取鼠标位置的脚本。

不应该太难：）

游标JAVASCRIPT需要适应wordpress DOCTYPE

1 个答案: