-1

I need to change the background image on mouseover, but don't know how to do it as it is in a document.write that I did not write. Any help is appreciated. Here is what I have so far. I want B to be whats there normally and MO on the mouseover.

<script type="text/javascript">
function DrawRow (Link,Status) {
    B = "../Images/GreenButton.png" ;
    MO = "../Images/GreenButtonMouseOver.png" ;
    color1 = "#66FF33"; color2="#000000"; color3="#000000"; color4="#000000"; color5="#000000";


    //====================================================================================================================
    //          Check User Defined States By Rule
    //====================================================================================================================

    if ( Status4 )  { B="../Images/BlueButton.png"; MO="../Images/BlueButtonMouseOver.png"; color1="#FFFFFF"; }
    if ( Status32 ) { B="../Images/LightGreenButton.png"; B="../Images/LightGreenButtonMouseOver.png"; C1color="#000000"; }
    if ( Status2 )  { B="../Images/YellowButton.png"; MO="../Images/YellowButtonMouseOver.png"; C1color="#000000"; }
    if ( Status1 )  { B="../Images/OrangeButton.png"; MO="../Images/OrangeButtonMouseOver.png"; C1color="#000000"; }
    if ( Status8 )  { B="../Images/RedButton.png"; MO="../Images/RedButtonMouseOver.png";C1color="#FFFF00"; }
    if ( Status16 ) { B="../Images/PurpleButton.png"; MO="../Images/PurpleButtonMouseOver.png"; C1color="#000000"; }

document.write(  "<td ONCLICK=\"Jump('"+Link+"')\"onmouseover=\"this.style.cursor='hand'\" height='37' width='350' background='"+B+"' ><font color='"+color1+"'><p align='center'><b>"+T+"</b></td>"  );
4

5 に答える 5

2

jQuery問題を解決する可能性のある以下のコードを使用してください。

すべての がロードされdoitていることを確認したら、関数を呼び出しますtd

function doit(){
    //alert(MO);
    //alert(B);
$("td[onclick^='Jump']").each(function(){
    console.log(MO);
    console.log(B);
    $(this).attr("mouseoverpic", MO);
    $(this).attr("mouseoutpic", B);

      $(this).hover(
        function(){
          $(this).attr("background", $(this).attr("mouseoverpic"));
        },
       function(){
         $(this).attr("background", $(this).attr("mouseoutpic"));
        }
     );
 });
}

PS: このjsfiddleを見てください。もちろん参考にさせていただきました。

于 2013-08-02T10:47:50.250 に答える
1

このシンテックスを使用できます:

onmouseover="changeImage(this.id);"
 create a function like this :

    <script language="javascript" type="text/javascript">
    function changeImage(id)
    {
       $('#'+id).css("background-image", "url(your image path)");
    }

    </script>

jquery.js を含める必要があります

于 2013-08-02T09:10:57.360 に答える
1

CSSを追加してもよろしいですか?

<style>
  #somename{
    background-image:url("../Images/Green-360-Button.png");
  }
  #somename:hover{
    background-image:url("../Images/Green-360-ButtonMouseOver.png");
  }
</style>

そしてid="somename"<td>

于 2013-08-02T08:55:59.430 に答える
1

あなたのdivがこのような場合

 <div id="div_1"></div>

その後、スタイルを使用できます

#div_1:hover{ 
//your style for image
}
于 2013-08-02T08:56:55.887 に答える
0

最後に、ここで私がしなければならなかったことは非常に簡単であることがわかりました。スタイリングシートを使用して関数を試すのに3日かかりました。みんなの助けに感謝します。私はすべての貢献に賛成しました!

    document.write(  "<td ONCLICK=\"Jump('"+Link+"')\" onmouseover=\"this.style.background='url("+M+")'; this.style.cursor='pointer';\" onmouseout=\"this.style.background='url("+B+")';\" onmousedown=\"this.style.background='url(../Images/Gold-360-ButtonMouseOver.png)'\"  height='25' width='350' background='"+B+"' ><p align='center'><font color='"+C1color+"'><b>"+T+"</b></td>"  );
于 2013-08-05T06:18:56.883 に答える