- ベストアンサー
ロールオーバー？について
私はDWが少し使えるようになった程度です。 現在克服したい内容は、たとえば表（将棋盤をイメージ）を作成の後、マスにカーソルが乗った時に色を変えることです。しかもX軸、Y軸も同時に同色になるようにしたいのです。いろいろな方法はあるとは思いますがどなたか教えてください。CSS? Javascript?
- ssynt3332
- お礼率100% (4/4)
- ホームページ作成ソフト
- 回答数1
- ありがとう数3
- みんなの回答 （1）
- 専門家の回答
質問者が選んだベストアンサー
もっとうまい方法がありそうな気がしますが、とりあえずのサンプルとして… Javascript利用での一例です。 （colspan、rowspanなどを使用していないものと仮定しています） <html> <head> <style type="text/css"> tr { height:50px; } td { width:50px; } </style> <script type="text/javascript"><!-- var t,r; window.onload=function(){ t=document.getElementById('data1').getElementsByTagName('TD'); r=document.getElementById('data1').rows; for (i=0; i<t.length; i++){ t[i].onmouseover=function(){set(this)}; t[i].onmouseout=function(){out()}; } } function set(e){ var er=e.parentNode; var i=0,elm; while (elm=r[i++]){if(elm==er){var erN=i-1; break;}} i=0; while (elm=r[erN].cells[i++]){if(elm==e){var ecN=i-1; break;}} out(); for (i=0; i<r.length; i++){ r[i].cells[ecN].style.backgroundColor='yellow'; if (i==erN) r[i].style.backgroundColor='yellow'; } } function out(){ for (var i=0; i<t.length; i++) t[i].style.backgroundColor=''; for (var i=0; i<r.length; i++) r[i].style.backgroundColor=''; } // --></script> </head> <body> <table border=1 id="data1"> <thead></thead> <tbody> <tr><td>11</td><td>12</td><td>13</td><td>14</td><td>15</td></tr> <tr><td>21</td><td>22</td><td>23</td><td>24</td><td>25</td></tr> <tr><td>31</td><td>32</td><td>33</td><td>34</td><td>35</td></tr> <tr><td>41</td><td>42</td><td>43</td><td>44</td><td>45</td></tr> <tr><td>51</td><td>52</td><td>53</td><td>54</td><td>55</td></tr> </tbody> </table> </body> </html>
![その他([技術者向] コンピューター) イメージ](https://gazo.okwave.jp/okwave/spn/images/related_qa/c205_2_thumbnail_img_sm.png)
お礼
お手数でした。ありがとうございます。 ほぼ満足です。早速アレンジしてみたいとおもいます。