css3的話IE是支持不怎麼好,支持不到IE8的想實現簡單的側滑效果可以用jquery,以下代碼包括了自適應的一些處理邏輯
//側邊欄Dom
var $side = $(".sd-side");
$(".aside-toggler").bind('click', function () {
//側邊欄行行內樣式
var attr = $side.attr('style');
if (typeof attr === 'undefined') {
$side.animate({ opacity: '0.8', width: '240px' }, 300);
} else {
$side.animate({ opacity: '0.8', width: '0' }, 300, function () { $side.removeAttr('style') });
}
});
//事件監聽
$(window).on('resize', function () {
//側邊欄行行內樣式
var attr = $side.attr('style');
if ($(window).width() >= 1200) {
if (typeof attr !== 'undefined') {
$side.removeAttr('style')
}
}
})