首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

jquery统制漂浮层 在鼠标单击时的坐标位置显示

2012-09-06 
jquery控制漂浮层 在鼠标单击时的坐标位置显示?script$(function(){$(#closeCon).click(function(){ $

jquery控制漂浮层 在鼠标单击时的坐标位置显示

?

<script>$(function(){$('#closeCon').click(function(){ $('#kfms').hide('slow'); });$('.kfConDiv').bind('click',function(e){var xx = e.originalEvent.x || e.originalEvent.layerX || 0; var yy = e.originalEvent.y || e.originalEvent.layerY || 0; $('#kfms').css('top',yy);$('#kfms').css('left',xx);$('#kfms').show('slow',function(){ $('#kfContent').text('扣分原因'); });});});</script>

?<style>

body{ background:url(../../../vehstyle/css/material/bg/examTblBg.jpg)}.drvScoreDataTr td{border:1px solid blue;}.kfConDiv{width:262px; height:36px; border:1px solid red; text-overflow:ellipsis;}.mesCtn{ position:absolute; top:500px; left:460px; width:200px; height:120px; padding:2px; background-color:#6CF; display:none;}.closeCtn{ float:left; width:200px; height:23px; padding:1px; background-color:#6699FF;}.closeDiv{ float:right; width:25px; height:25px; line-height:25px; color:#009; font-size:38px; text-align:center; background-color:#F33; border:#009; cursor:pointer;}.contentDiv{ float:left; font-size:13px; width:192px; height:86px; padding:5px;}</style>

?<body>

<table id="drvScoreMes" cellpadding="0" cellspacing="0" style=" border:1px solid #ccc;">  <tr id="drvScoreMesTitle">    <td style="width:40px;" align="center">&nbsp;扣分 </td>    <td align="center"> &nbsp;操作 </td>    <td></td>  </tr>  <tr colspan="2" align="center">&nbsp;扣分 </td>    <td style="width:262px;" colspan="2">     <div align="center"> <input type="button" value="删除" /> </td>    <td></td>  </tr></table><!-- =================================== 内容层 =================================== --><div id="kfms" class="contentDiv"></div></div></body>

热点排行
Bad Request.