我使用的是here代码。
$('a.popper').hover(function (e) {...});
<script src="jquery-1.2.6.js"></script>
<script type="text/javascript">
var moveLeft = 0;
var moveDown = 0;
$('a.popper').hover(function (e) {
var target = '#' + ($(this).attr('data-popbox'));
$(target).show();
moveLeft = $(this).outerWidth();
moveDown = ($(target).outerHeight() / 2);
}, function () {
var target = '#' + ($(this).attr('data-popbox'));
if (!($("a.popper").hasClass("show"))) {
$(target).hide();
}
});
$('a.popper').mousemove(function (e) {
var target = '#' + ($(this).attr('data-popbox'));
leftD = e.pageX + parseInt(moveLeft);
maxRight = leftD + $(target).outerWidth();
windowLeft = $(window).width() - 40;
windowRight = 0;
maxLeft = e.pageX - (parseInt(moveLeft) + $(target).outerWidth() + 20);
if (maxRight > windowLeft && maxLeft > windowRight) {
leftD = maxLeft;
}
topD = e.pageY - parseInt(moveDown);
maxBottom = parseInt(e.pageY + parseInt(moveDown) + 20);
windowBottom = parseInt(parseInt($(document).scrollTop()) + parseInt($(window).height()));
maxTop = topD;
windowTop = parseInt($(document).scrollTop());
if (maxBottom > windowBottom) {
topD = windowBottom - $(target).outerHeight() - 20;
} else if (maxTop < windowTop) {
topD = windowTop + 20;
}
$(target).css('top', topD).css('left', leftD);
});
$('a.popper').click(function (e) {
var target = '#' + ($(this).attr('data-popbox'));
if (!($(this).hasClass("show"))) {
$(target).show();
}
$(this).toggleClass("show");
});
</script>
<div id="pop1" class="popbox">
<h2>Job Info Search</h2>
<h2>WRKNo : <input type="text" /></h2>
<h2>Result</h2>
<p>Customer Name :
<input type="text" />
</p>
<p>Caller Number :
<input type="text" />
</p>
<p>Complosed :
<input type="text" />
</p>
<p>Cate :
<input type="text" />
</p>
<p>Det :
<input type="text" />
</p>
<p>Feedback :
<input type="text" />
</p>
<p>WRKNo :
<input type="text" />
</p>
这是一个popbox测试。徘徊在这里看看它是如何工作的。
CSS
.popbox {
display: none;
position: absolute;
z-index: 99999;
width: 400px;
padding: 10px;
background: #EEEFEB;
color: #000000;
border: 1px solid #4D4F53;
margin: 0px;
-webkit-box-shadow: 0px 0px 5px 0px rgba(164, 164, 164, 1);
box-shadow: 0px 0px 5px 0px rgba(164, 164, 164, 1);
}
.popbox h2 {
background-color: #4D4F53;
color: #E3E5DD;
font-size: 14px;
display: block;
width: 100%;
margin: -10px 0px 8px -10px;
padding: 5px 10px;
}
它在那里工作正常,但是如果我在asp.net中使用相同的代码它就不起作用。什么都没发生。是否有更多的解决方法可以使它在asp.net中运行,或者这个方法完全不支持asp.net
我如何在asp.net中做同样的事情?
谢谢,
答案 0 :(得分:0)
就像Rick所说,ASPX代码会很有用。 JavaScript和ASP并不总是很好用,可能需要一个ScriptManager。
答案 1 :(得分:0)
我曾要求你发布你的ASPX页面,但我想你不想这样我们所能做的只是猜猜你的问题是什么。尝试将所有脚本代码包装在document.ready()中。如果仍有问题,请尝试打开浏览器控制台(F12),看看控制台是否有任何错误。
$(document).ready(function () {
var moveLeft = 0;
var moveDown = 0;
$('a.popper').hover(function (e) {
var target = '#' + ($(this).attr('data-popbox'));
$(target).show();
moveLeft = $(this).outerWidth();
moveDown = ($(target).outerHeight() / 2);
}, function () {
var target = '#' + ($(this).attr('data-popbox'));
if (!($("a.popper").hasClass("show"))) {
$(target).hide();
}
});
....rest of your code
});