如何按字母顺序点击?

时间:2012-07-02 02:00:28

标签: php svg alphabetical

我是编码的新手,所以我想问一下如何制作下面的代码,鱼只能按字母顺序点击,这意味着只有点击鱼'A'可以点击其他鱼而不是'A',点击后不能消失?有办法吗?

<?xml version='1.0' standalone='no'?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
   "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">

<svg width='100%' height='100%' xmlns='http://www.w3.org/2000/svg' onload='Init(evt)'>
   <title>Fish Game</title>
   <script type='text/ecmascript'><![CDATA[
      var SVGDocument = null;
      var SVGRoot = null;

      function Init(evt)
      {
         SVGDocument = evt.target.ownerDocument;
         SVGRoot = SVGDocument.documentElement;
      }

      function ToggleOpacity(evt, targetId)
      {
         var newTarget = evt.target;

         if (targetId)
         {
            newTarget = SVGDocument.getElementById(targetId);
         }

         var newValue = newTarget.getAttributeNS(null, 'opacity')

         if ('0' != newValue)
         {
            newValue = '0';
         }
         else
         {
            newValue = '1';
         }

         newTarget.setAttributeNS(null, 'opacity', newValue);

         if (targetId)
         {
            SVGDocument.getElementById(targetId + 'Exception').setAttributeNS(null, 'opacity', '1');
         }
      }
   ]]></script>

 <?php 
    mysql_connect("localhost", "root", "") or die(mysql_error()); 
    mysql_select_db("db") or die(mysql_error()); 
    static $data;
    $data = mysql_query("SELECT * FROM alphabet;") 
    or die(mysql_error()); 

    while($info = mysql_fetch_array( $data )) { 
 ?> 
 <text x="20" y="20"  style="font-family:Times,serif;fill:#B40404;font-size:20px">please find the letter:</text>

//fish body
<g id='<?php print $info['ID']; ?>' onclick='ToggleOpacity(evt, "<?php print $info['ID']; ?>")'>
 <circle cx="<?php print $info['body_cx']; ?>"cy="<?php print $info['body_cy']; ?>" r="<?php print $info['body_r']; ?>" stroke="black" stroke-width="1" fill="<?php print $info['body_fill']; ?>" />

//tail
<path d="<?php print $info['tail']; ?>" fill="<?php print $info['tail_fill']; ?>" stroke="<?php print $info['tail_stroke']; ?>" stroke-width="1" />

//eye
<circle cx="<?php print $info['eye_cx']; ?>" cy="<?php print $info['eye_cy']; ?>" r="<?php print $info['eye_r']; ?>" stroke="black" stroke-width="1" fill="<?php print $info['eye_fill' ];?>" />
<circle cx="<?php print $info['pupil_cx']; ?>" cy="<?php print $info['pupil_cy']; ?>" r="<?php print $info['pupil_r']; ?>" stroke="black" stroke-width="1  " />

//'A'
    <text x="<?php print $info['al_x']; ?>" y="<?php print $info['al_y']; ?>" style="font-family:Times,serif;fill:#B40404;font-size:<?php print $info['size']; ?>"><?php print $info['Alphabet']; ?></text>

    <animateMotion
        from="<?php print $info['from']; ?>" to="<?php print $info['to']; ?>"
        dur="<?php print $info['duration']; ?>"   repeatCount="indefinite" />
   </g>
  <?php   
    }  
 ?>
</svg>

1 个答案:

答案 0 :(得分:0)

SELECT * 
FROM  `alphabet` 
ORDER BY  `Alphabet` ASC