我们的生活比蜜甜

2009-05-14

JS和CSS的一些小应用 - [JQuery]

版权声明：转载时请以超链接形式标明文章原始出处和作者信息及本声明
http://bbayou.blogbus.com/logs/39388407.html

1.select对话框，选择对应value的内容，并显示在DIV里。

<script>
function showimage(arg){
  var dd = arg.indexOf('img:');
  var ff = arg.substring(dd+4);
  hehe.style.display='';
  susu.src= 'Dock.jpg';
}
function qudiao(){
  hehe.style.display='none';
}
</script>
<style type="text/css">
<!--
#hehe {
    position:absolute;
    width:200px;
    height:115px;
    z-index:1;
    left: 66px;
    top: 21px;
}
-->
</style>

<div id="hehe" style="display:none">
<img  id="susu" onmouseout="qudiao()" src="" width="500px"  height="100px" border="0" /></div>
<select id="engraving_cy" style="width: 800px;" size="5" name="engraving_cy" onchange="showimage(this.options[selectedIndex].text)">
<option value="950@p@140x77x3xpublic/upload/material/431a25f852f7b0ea79c9adc594785812.jpg@p@mm">dimg:public/upload/material/431a25f852f7b0ea79c9adc594785812.jpg</option>
<option value="650@p@140x77x2xpublic/upload/material/431a25f852f7b0ea79c9adc594785812.jpg@p@mm">price:650;width:140;height:77;amount:2;unit:;img:public/upload/material/431a25f852f7b0ea79c9adc594785812.jpg</option>
</select>

2. 鼠标划过，变色！！！

最简单的办法：

<table width="200" border="1">
      <tr  onmouseover="this.bgColor='#666666'" onmouseout="this.bgColor='#FFFFFF'" >
          <td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td>
      </tr>
     <tr  onmouseover="this.bgColor='#666666'" onmouseout="this.bgColor='#FFFFFF'" >
          <td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td>
     </tr>
</table>