在我的網站上,如果頁面首次加載並且已被最大化/全屏顯示,div comBrand
具有我要應用的特定CSS屬性。檢查div是否應用了特定樣式
在調整大小事件過程中,我使用.css()
函數將不同屬性應用於該元素,以便該div不與其他屏幕項目重疊,但是,實際上不是改變CSS,而是將style屬性添加到該div在代碼中。有時根據您如何調整頁面大小,調整大小功能可能以如下方式結束:使用最大化按鈕時,最終會導致特定div的錯誤位置。我正在檢查一些事情以確保不會發生。
但是,我不知道這裏的語法是否正確在resize函數期間檢查div的樣式屬性,因爲它似乎沒有按預期工作。
$(window).resize(function() {
//first check
if ($('#comBrand').css('top') == '155px')
{
//second check to see if the peculiuar event was reached where the div is positioned incorrectly but the window isn't maximized
if (($('#comBrand').attr('style') == 'top: 155px;margin-left: -615px;left: 50%;') && (window.screen.width > window.screen.availWidth))
{
$('#comBrand').css({'top': '155px', 'margin-left': '-615px', 'left': '50%'});
}
else //assume that the page is already maximized and adjust the div accordingly
{
$('#comBrand').css({'top': '141px', 'margin-left': '0', 'left': '0'});
}
}
else //default else, if the CSS of the div is anything other than what was initially checked for, set it back to its default location
{
$('#comBrand').css({'top': '155px', 'margin-left': '-615px', 'left': '50%'});
}
});
我知道這是一個有點混亂,黑客攻擊有點和,但我還是想獲得它的功能。
我添加了兩個班,並給DIV comBrand類的最大化,在html硬編碼,然後在調整大小功能,使用此代碼,但是,它不能正常工作或做任何事......
$(window).resize(function() {
if ($('#comBrand').hasClass('maximized'))
{
$('#comBrand').removeClass('maximized');
$('#comBrand').addClass('minimized');
}
else {
$('#comBrand').removeClass('minimized');
$('#comBrand').addClass('maximized');
}
});
'在resize事件我使用.css()函數將不同的屬性應用於該元素,看到該部分會很有趣。你有沒有考慮過使用媒體查詢?爲什麼你檢查'if($('#comBrand').css('top')=='155px')'而不是特定的窗口寬度?你也使用這個邏輯:'if === 155' else else'$('#comBrand')。css({'top':'155px','對我來說沒有意義......很難理解你實際上需要 – 2014-10-30 19:04:05