Div以盲效果出现问题jquery
我已经编写了一个例程,它将动态创建一个div并覆盖另一个div。我的代码可以正常工作,但我正在尝试这样做,但还不够完美。我认为我的代码中存在逻辑或css相关的问题。因此,这里我给我的代码,请通过,如果可能的话,请纠正它 我的html 我的Jquery例程 如果有人运行代码,那么他/她会看到BlindBox div没有正确地覆盖我的另一个div,即box outer。请看看我的日常生活,告诉我有什么问题。如有可能,请予以纠正 在这里,我给另一个网址链接,只要点击这里,你就会看到效果,我试图完全通过代码。我希望通过代码实现同样的效果。所以请告诉我代码中的问题是什么。谢谢Div以盲效果出现问题jquery,jquery,Jquery,我已经编写了一个例程,它将动态创建一个div并覆盖另一个div。我的代码可以正常工作,但我正在尝试这样做,但还不够完美。我认为我的代码中存在逻辑或css相关的问题。因此,这里我给我的代码,请通过,如果可能的话,请纠正它 我的html 我的Jquery例程 如果有人运行代码,那么他/她会看到BlindBox div没有正确地覆盖我的另一个div,即box outer。请看看我的日常生活,告诉我有什么问题。如有可能,请予以纠正 在这里,我给另一个网址链接,只要点击这里,你就会看到效果,我试图完全通过
<div id="box-outer">
<div id="data-box">
This is your data.
</div>
</div>
<asp:Button ID="blinddwn" runat="server" Text="BLIND-2-DOWN" />
#box-outer
{
overflow: hidden;
height: 200px;
width: 200px;
margin: 20px;
padding: 10px;
background-color:Green;
}
$(document).ready(function () {
jQuery.fn.exists = function () { return this.length > 0; }
jQuery.fn.blindToggle = function (speed, easing, callback) {
var oDiv;
var margin_top = this.outerHeight() + parseInt(this.css('paddingTop')) + parseInt(this.css('paddingBottom'));
if ($("#BlindBox").exists() == false) {
var _height = this.outerHeight();
var _width = this.outerWidth();
oDiv = $("<div id='BlindBox'></div>");
oDiv.css("height", _height + 'px');
oDiv.css("width", _width + 'px');
oDiv.css("margin-top", ('-' + margin_top + 'px'));
oDiv.css("padding", "10px");
oDiv.css("background", "#e459e9");
oDiv.css("position", "relative");
oDiv.css("display", "none");
this.append(oDiv);
}
else {
oDiv = $('#BlindBox');
}
if (parseInt(oDiv.css('marginTop')) < 0) {
oDiv.css('display', 'none');
}
return oDiv.animate({ opacity: 'toggle',
marginTop: parseInt(oDiv.css('marginTop')) < 0 ? 0 : ('-' + margin_top + 'px')
}, speed, easing, callback);
};
});
$(document).ready(function () {
$('#blinddwn').click(function () {
$('#box-outer').blindToggle('slow');
return false;
});
});