简单介绍关于前端的onmouseover事件(实例) 爱问知识人
修改别人的模板遇到一个问题,分类图的切换默认是五个,我想增加四个,一直没有增加成功。它使用的onmouseover 事件。onmouseover怎么用?去查了一下:定义和用法onmouseover 事件会在鼠标指针移动到指定的对象上时发生。语法
onmouseover="SomeJavaScriptCode"参数描述SomeJavaScriptCode必需。
规定该事件发生时执行的 JavaScript。支持该事件的 HTML 标签:
<a> <address> <area> <b> <bdo> <big> <blockquote> <body> <button> <caption> <cite> <code> <dd> <dfn> <p> <dl> <dt> <em> <fieldset> <form> <h1> to <h6> <hr> <i> <img> <input> <kbd> <label> <legend> <li> <map> <ol> <p> <pre> <samp> <select> <small> <span> <strong> <sub> <sup> <table> <tbody> <td> <textarea> <tfoot> <th> <thead> <tr> <tt> <ul> <var>支持该事件的 JavaScript 对象:
layer, linkonmouseover用法实例 1在下面的例子中,我们将在用户把鼠标指针移动到图像上时显示一个对话框:<img src="/i/eg_mouse2。
jpg" alt="mouse"onmouseover="alert('您的鼠标在图片上!')" />输出:(请把鼠标移动图片上):鼠标放上去会切换另外一个图。附上代码:<html><head><script type="text/javascript">function mouseOver(){document。
getElementById('b1')。src ="/i/eg_mouse。jpg"}function mouseOut(){document。getElementById('b1')。src ="/i/eg_mouse2。
jpg"}</script></head><body><a href="http://www。w3school。com。cn" onmouseover="mouseOver()" onmouseout="mouseOut()"><img alt="Visit W3School!" src="/i/eg_mouse2。
jpg" id="b1" /></a></body></html>我的业务代码:<p class="wscp_t"> {dede:type typeid=11}<a href="[field:typelink/]" class="wscp_on" id="wscp_1" onmouseover="tabname1('wscp_''wscp_a''1''9''wscp_on''wscp_off');" >[field:typename/]</a> {/dede:type} {dede:type typeid=12}<a href="[field:typelink/]" class="wscp_off" id="wscp_2" onmouseover="tabname1('wscp_''wscp_a''2''9''wscp_on''wscp_off');">[field:typename/]</a> {/dede:type} {dede:type typeid=13}<a href="[field:typelink/]" class="wscp_off" id="wscp_3" onmouseover="tabname1('wscp_''wscp_a''3''9''wscp_on''wscp_off');">[field:typename/]</a> {/dede:type} {dede:type typeid=14}<a href="[field:typelink/]" class="wscp_off" id="wscp_4" onmouseover="tabname1('wscp_''wscp_a''4''9''wscp_on''wscp_off');">[field:typename/]</a> {/dede:type} {dede:type typeid=15}<a href="[field:typelink/]" class="wscp_off" id="wscp_5" onmouseover="tabname1('wscp_''wscp_a''5''9''wscp_on''wscp_off');">[field:typename/]</a>{/dede:type} {dede:type typeid=16}<a href="[field:typelink/]" class="wscp_off" id="wscp_6" onmouseover="tabname1('wscp_''wscp_a''6''9''wscp_on''wscp_off');">[field:typename/]</a>{/dede:type}{dede:type typeid=19}<a href="[field:typelink/]" class="wscp_off" id="wscp_7" onmouseover="tabname1('wscp_''wscp_a''7''9''wscp_on''wscp_off');">[field:typename/]</a>{/dede:type} {dede:type typeid=20}<a href="[field:typelink/]" class="wscp_off" id="wscp_8" onmouseover="tabname1('wscp_''wscp_a''8''9''wscp_on''wscp_off');">[field:typename/]</a>{/dede:type} </p>代码结束。
其中:'wscp_a''1''9' 代表的意思是1,第一个,9,一共九个下面就是调用的html:<p class="wscp_c" id="wscp_a1" style="display:block;"> <ul> {dede:arclist row=4 typeid=11} <li> <a href="[field:arcurl/]" title="[field:title/]"><img src="[field:litpic/]" alt="[field:title/]" title="[field:title/]" width="262" height="325"/></a> <p><a href="[field:arcurl/]" title="[field:title/]">[field:title/]</a></p> </li> {/dede:arclist} </ul> </p>。