Trung tâm cá nhân
cuốn sách gpt4 ai đã làm

IE11中的CSS动画背景-位置

In lại Tác giả: Vũ trụ không gian Thời gian cập nhật: 2023-11-04 06:04:03 33 4
mua khóa gpt4 Nike

Tôi đang cố gắng tạo một hoạt ảnh CSS lặp qua 16 hình ảnh trong một trang sprite, tạo ảo giác về một con ma "nổi". Hoạt hình qua trong vị trí nền Điều này được thực hiện bằng cách di chuyển giữa các địa điểm để phát hiện những bóng ma ở các trạng thái khác nhau.

nhập mô tả hình ảnh ở đây

Nó hoạt động tốt trong Chrome, Firefox và Safari. Trong IE11 thì không.

(Thử nghiệm Browserstack cho thấy nó thực sự hoạt động trong Edge.)

Tôi thấy trên Internet rằng IE không hỗ trợ hoạt ảnh của hình nền, nhưng đây là nền-chức vụ. Có lẽ đó là vấn đề.

Đây là mã hoặc JSFiddle để trợ giúp:https://jsfiddle.net/nuw1ypfm/6/ 

.bóng ma {
    chiều rộng: 64px;
    chiều cao: 64px;
    position: absolute;
    trên cùng: 50%;
    trái: 50%;
    biến đổi: dịch(-50% -50%);
    -webkit-transform: dịch(-50% -50%);
    hình nền: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAACDCAYAAABFqhNlAAAACXBIWXMAAAsTAAALEwEampwYAAAKT2lDQ1BQaG90b3Nob 3AgSUNDIHByb2ZpbGUAAHjanVNnVFPpFj333vRCS4iAlEtvUhUIIFJCi4AUkSYqIQkQSoghodkVUcERRUUEG8igiAOOjoC MFVEsDIoK2AfkIaKOg6OIisr74Xuja9a89+bN/rXXPues852zzwfACAyWSDNRNYAMqUIeEeCDx8TG4eQuQIEKJHAAEAizZ CFz/SMBAPh+PDwrIsAHvgABeNMLCADATZvAMByH/w/qQplcAYCEAcB0kThLCIAUAEB6jkKmAEBGAYCdmCZTAKAEAGDLY2L jAFAtAGAnf+bTAICd+Jl7AQBblCEVAaCRACATZYhEAGg7AKzPVopFAFgwABRmS8Q5AngtADBJV2ZIALC3AMDOEAuyAAgM ADBRiIUpAAR7AGDIIyN4AISZABRG8lc88SuuEOcqAAB4mbI8uSQ5RYFbCC1xB1dXLh4ozkkXKxQ2YQJhmkAuwnmZGTKBNA /g88wAAKCRFRHgg/P9eM4Ors7ONo62Dl8t6r8G/yJiYuP+5c+rcEAAAOF0ftH+LC+zGoA7BoBt/qIl7gRoXgugdfeLZrIP QLUAoOnaV/Nw+H48PEWhkLnZ2eXk5NhKxEJbYcpXff5nwl/AV/1s+X48/Pf14L7iJIEyXYFHBPjgwsz0TKUcz5IJhGLc5o 9H/LcL//wd0yLESWK5WCoU41EScY5EmozzMqUiiUKSKcUl0v9k4t8s+wM+3zUAsGo+AXuRLahdYwP2SycQWHTA4vcAAPK 7b8HUKAgDgGiD4c93/+8//UegJQCAZkmScQAAXkQkLlTKsz/HCAAARKCBKrBBG/TBGCzABhzBBdzBC/xgNoRCJMTCQhBCC mSAHHJgKayCQiiGzbAdKmAv1EAdNMBRaIaTcA4uwlW4Dj1wD/phCJ7BKLyBCQRByAgTYSHaiAFiilgjjggXmYX4IcFIBBK LJCDJiBRRIkuRNUgxUopUIFVIHfI9cgI5h1xGupE7yAAygvyGvEcxlIGyUT3UDLVDuag3GoRGogvQZHQxmo8WoJvQcrQaP Yw2oefQq2gP2o8+Q8cwwOgYBzPEbDAuxsNCsTgsCZNjy7EirAyrxhqwVqwDu4n1Y8+xdwQSgUXACTYEd0IgYR5BSFhMWE 7YSKggHCQ0EdoJNwkDhFHCJyKTqEu0JroR+cQYYjIxh1hILCPWEo8TLxB7iEPEnyQSiUMyJ7mQAkmxpFTSEtJG0m5SI+ks qZs0SBojk8naZGuyBzmULCaryIXkneTD5DPkG+Qh8lsKnWJAcaT4U+IoUspqShnlEOU05QZlmDJBVaOaUt2ooVQRNY9aQq 2htlKvUYeoEzR1mjnNgxZJS6WtopXTGmgXaPdpr+h0uhHdlR5Ol9BX0svpR+iX6AP0dwwNhhWDx4hnKBmbGAcYZxl3GK+Y TKYZ04sZx1QwNzHrmOeZD5lvVVgqtip8FZHKCpVKlSaVGyovVKmqpqreqgtV81XLVI+pXlN9rkZVM1PjqQnUlqtVqp1Q6 1MbU2epO6iHqmeob1Q/pH5Z/YkGWcNMw09DpFGgsV/jvMYgC2MZs3gsIWsNq4Z1gTXEJrHN2Xx2KruY/R27iz2qqaE5QzN KM1ezUvOUZj8H45hx+Jx0TgnnKKeX836K3hTvKeIpG6Y0TLkxZVxrqpaXllirSKtRq0frvTau7aedpr1Fu1n7gQ5Bx0onX CdHZ4/OBZ3nU9lT3acKpxZNPTr1ri6qa6UbobtEd79up+6Ynr5egJ5Mb6feeb3n+hx9L/1U/W36p/VHDFgGswwkBtsMzhg 8xTVxbzwdL8fb8VFDXcNAQ6VhlWGX4YSRudE8o9VGjUYPjGnGXOMk423GbcajJgYmISZLTepN7ppSTbmmKaY7TDtMx83M zaLN1pk1mz0x1zLnm+eb15vft2BaeFostqi2uGVJsuRaplnutrxuhVo5WaVYVVpds0atna0l1rutu6cRp7lOk06rntZnw7 Dxtsm2qbcZsOXYBtuutm22fWFnYhdnt8Wuw+6TvZN9un2N/T0HDYfZDqsdWh1+c7RyFDpWOt6azpzuP33F9JbpL2dYzxDP 2DPjthPLKcRpnVOb00dnF2e5c4PziIuJS4LLLLpc+Lpsbxt3IveRKdPVxXeF60vWdm7Obwu2o26/uNu5p7ofcn8w0nymeWT Nz0MPIQ+BR5dE/C5+VMGvfrH5PQ0+BZ7XnIy9jL5FXrdewt6V3qvdh7xc+9j5yn+M+4zw33jLeWV/MN8C3yLfLT8Nvnl+ F30N/I/9k/3r/0QCngCUBZwOJgUGBWwL7+Hp8Ib+OPzrbZfay2e1BjKC5QRVBj4KtguXBrSFoyOyQrSH355jOkc5pDoVQf ujW0Adh5mGLw34MJ4WHhVeGP45wiFga0TGXNXfR3ENz30T6RJZE3ptnMU85ry1KNSo+qi5qPNo3ujS6P8YuZlnM1VidWEl sSxw5LiquNm5svt/87fOH4p3iC+N7F5gvyF1weaHOwvSFpxapLhIsOpZATIhOOJTwQRAqqBaMJfITdyWOCnnCHcJnIi/RN tGI2ENcKh5O8kgqTXqS7JG8NXkkxTOlLOW5hCepkLxMDUzdmzqeFpp2IG0yPTq9MYOSkZBxQqohTZO2Z+pn5mZ2y6xlhb L+xW6Lty8elQfJa7OQrAVZLQq2QqboVFoo1yoHsmdlV2a/zYnKOZarnivN7cyzytuQN5zvn//tEsIS4ZK2pYZLVy0dWOa9 rGo5sjxxedsK4xUFK4ZWBqw8uIq2Km3VT6vtV5eufr0mek1rgV7ByoLBtQFr6wtVCuWFfevc1+1dT1gvWd+1YfqGnRs+FY mKrhTbF5cVf9go3HjlG4dvyr+Z3JS0qavEuWTPZtJm6ebeLZ5bDpaql+aXDm4N2dq0Dd9WtO319kXbL5fNKNu7g7ZDuaO/PLi8ZafJzs07P1SkVPRU+lQ27tLdtWHX+G7R7ht7vPY07NXbW7z3/T7JvttVAVVN1WbVZftJ+7P3P66Jqun4lvttXa1Ob XHTXWPSA/0HiW6217NU1R3SPVRSJ9YR60COXX ++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 DSXkm4RbjgGoI1jhEoxA0Smgwm++tiếp theoDTMXg3oClSCBKzjfsTkLohxSOYpG5LSGYeL3FoAtEHUSVwC+4ELH7qPl9gdQ2X8DAKEhOt9O4Sj/AAAAAEelFTkSuQmCC');
    Độ mờ: 0,75;
    chỉ số z: 101;
    phải: 0;
    đáy: 0;
    kích thước nền: 256px 262px;
    vị trí nền: -64px -198px;
    sẽ thay đổi: vị trí nền;
    tên hoạt hình: float; 
    hoạt hình-thời gian-chức năng: bước cuối, bước cuối;
    chế độ điền hoạt ảnh: chuyển tiếp;
    thời lượng hoạt ảnh: 5 giây;
    
    -webkit-animation-name: float; 
    -webkit-animation-timing-function: bước cuối, bước cuối;
    -webkit-animation-fill-mode: chuyển tiếp;
    -webkit-hoạt hình-thời lượng: 5 giây;
    
    -ms-animation-name: float; 
    -ms-animation-timing-function: bước cuối, bước cuối;
    -ms-animation-fill-mode: chuyển tiếp;
    -ms-hoạt hình-thời lượng: 5 giây;
    
}


@keyframes nổi {
	0% {
		vị trí nền: -128px -131px
	}
	10% {
		vị trí nền: -192px -131px
	}
	12,5% ​​{
		vị trí nền: -128px -131px
	}
	15% {
		vị trí nền: -64px -131px
	}
	17,5% {
		vị trí nền: 0 -133px
	}
	20% {
		vị trí nền: 0 -133px
	}
	22,5% {
		vị trí nền: -192px -131px
	}
	25% {
		vị trí nền: -128px -131px
	}
	27,5% {
		vị trí nền: -64px -131px
	}
	30% {
		vị trí nền: 0 -133px
	}
	32,5% {
		vị trí nền: 0 -133px
	}
	35% {
		vị trí nền: -192px -131px
	}
	37,5% {
		vị trí nền: -128px -131px
	}
	40% {
		vị trí nền: -64px -131px
	}
	42,5% {
		vị trí nền: 0 -133px
	}
	45% {
		vị trí nền: 0 -133px
	}
	47,5% {
		vị trí nền: -192px -131px
	}
	50% {
		vị trí nền: -128px -131px
	}
	52,5% {
		vị trí nền: -64px -131px
	}
	55% {
		vị trí nền: 0 -133px
	}
	57,5% {
		vị trí nền: 0 -133px
	}
	60% {
		vị trí nền: -192px -131px
	}
	62,5% {
		vị trí nền: -128px -131px
	}
	65% {
		vị trí nền: 0 -2px
	}
	67,5% {
		vị trí nền: -192px 1px
	}
	70% {
		vị trí nền: -192px 1px
	}
	72,5% {
		vị trí nền: -128px 2px
	}
	75% {
		vị trí nền: -128px -131px
	}
	77,5% {
		vị trí nền: -64px -131px
	}
	80% {
		vị trí nền: -192px 1px
	}
	82,5% {
		vị trí nền: -192px 1px
	}
	85% {
		vị trí nền: -128px 2px
	}
	87,5% {
		vị trí nền: -64px 2px
	}
	90% {
		vị trí nền: 0 -2px
	}
	92,5% {
		vị trí nền: -192px 1px
	}
	95% {
		vị trí nền: -192px 1px
	}
	97,5% {
		vị trí nền: -128px 2px
	}
	100% {
		vị trí nền: -128px -131px
	}
}

@-webkit-keyframe nổi {
	0% {
		vị trí nền: -128px -131px
	}
	2,5% {
		vị trí nền: -64px -131px
	}
	5% {
		vị trí nền: 0 -133px
	}
	7,5% {
		vị trí nền: 0 -133px
	}
	10% {
		vị trí nền: -192px -131px
	}
	12,5% ​​{
		vị trí nền: -128px -131px
	}
	15% {
		vị trí nền: -64px -131px
	}
	17,5% {
		vị trí nền: 0 -133px
	}
	20% {
		vị trí nền: 0 -133px
	}
	22,5% {
		vị trí nền: -192px -131px
	}
	25% {
		vị trí nền: -128px -131px
	}
	27,5% {
		vị trí nền: -64px -131px
	}
	30% {
		vị trí nền: 0 -133px
	}
	32,5% {
		vị trí nền: 0 -133px
	}
	35% {
		vị trí nền: -192px -131px
	}
	37,5% {
		vị trí nền: -128px -131px
	}
	40% {
		vị trí nền: -64px -131px
	}
	42,5% {
		vị trí nền: 0 -133px
	}
	45% {
		vị trí nền: 0 -133px
	}
	47,5% {
		vị trí nền: -192px -131px
	}
	50% {
		vị trí nền: -128px -131px
	}
	52,5% {
		vị trí nền: -64px -131px
	}
	55% {
		vị trí nền: 0 -133px
	}
	57,5% {
		vị trí nền: 0 -133px
	}
	60% {
		vị trí nền: -192px -131px
	}
	62,5% {
		vị trí nền: -128px -131px
	}
	65% {
		vị trí nền: 0 -2px
	}
	67,5% {
		vị trí nền: -192px 1px
	}
	70% {
		vị trí nền: -192px 1px
	}
	72,5% {
		vị trí nền: -128px 2px
	}
	75% {
		vị trí nền: -128px -131px
	}
	77,5% {
		vị trí nền: -64px -131px
	}
	80% {
		vị trí nền: -192px 1px
	}
	82,5% {
		vị trí nền: -192px 1px
	}
	85% {
		vị trí nền: -128px 2px
	}
	87,5% {
		vị trí nền: -64px 2px
	}
	90% {
		vị trí nền: 0 -2px
	}
	92,5% {
		vị trí nền: -192px 1px
	}
	95% {
		vị trí nền: -192px 1px
	}
	97,5% {
		vị trí nền: -128px 2px
	}
	100% {
		vị trí nền: -128px -131px
	}
}

@-ms-keyframe nổi {
	0% {
		vị trí nền: -128px -131px
	}
	2,5% {
		vị trí nền: -64px -131px
	}
	5% {
		vị trí nền: 0 -133px
	}
	7,5% {
		vị trí nền: 0 -133px
	}
	10% {
		vị trí nền: -192px -131px
	}
	12,5% ​​{
		vị trí nền: -128px -131px
	}
	15% {
		vị trí nền: -64px -131px
	}
	17,5% {
		vị trí nền: 0 -133px
	}
	20% {
		vị trí nền: 0 -133px
	}
	22,5% {
		vị trí nền: -192px -131px
	}
	25% {
		vị trí nền: -128px -131px
	}
	27,5% {
		vị trí nền: -64px -131px
	}
	30% {
		vị trí nền: 0 -133px
	}
	32,5% {
		vị trí nền: 0 -133px
	}
	35% {
		vị trí nền: -192px -131px
	}
	37,5% {
		vị trí nền: -128px -131px
	}
	40% {
		vị trí nền: -64px -131px
	}
	42,5% {
		vị trí nền: 0 -133px
	}
	45% {
		vị trí nền: 0 -133px
	}
	47,5% {
		vị trí nền: -192px -131px
	}
	50% {
		vị trí nền: -128px -131px
	}
	52,5% {
		vị trí nền: -64px -131px
	}
	55% {
		vị trí nền: 0 -133px
	}
	57,5% {
		vị trí nền: 0 -133px
	}
	60% {
		vị trí nền: -192px -131px
	}
	62,5% {
		vị trí nền: -128px -131px
	}
	65% {
		vị trí nền: 0 -2px
	}
	67,5% {
		vị trí nền: -192px 1px
	}
	70% {
		vị trí nền: -192px 1px
	}
	72,5% {
		vị trí nền: -128px 2px
	}
	75% {
		vị trí nền: -128px -131px
	}
	77,5% {
		vị trí nền: -64px -131px
	}
	80% {
		vị trí nền: -192px 1px
	}
	82,5% {
		vị trí nền: -192px 1px
	}
	85% {
		vị trí nền: -128px 2px
	}
	87,5% {
		vị trí nền: -64px 2px
	}
	90% {
		vị trí nền: 0 -2px
	}
	92,5% {
		vị trí nền: -192px 1px
	}
	95% {
		vị trí nền: -192px 1px
	}
	97,5% {
		vị trí nền: -128px 2px
	}
	100% {
		vị trí nền: -128px -131px
	}
}


Mọi hướng dẫn sẽ hữu ích.

Cảm ơn.

câu trả lời hay nhất

Tôi đã thử nhiều phương pháp khác nhau nhưng IE11 là một con thú phức tạp. Cách tốt nhất mà tôi tìm thấy là tạo nhiều lớp khác nhau và sau đó sử dụng bộ đếm thời gian JavaScript để lặp qua chúng. Tôi đã làm một việc như sau (tôi đã sử dụng jQuery, nhưng tôi không phải làm vậy):

.ghost.step1 { vị trí nền: xy }
.ghost.step2 { vị trí nền: x (y+5) }
.ghost.step3 { vị trí nền: (x+5) (y+10) }
.ghost.step4 { vị trí nền: (x+10) (y+15) }
...
.ghost.step40 { vị trí nền: xy }

varnum = 1;
var gInterval = setInterval(function(){ 

    if (num == 40) { //tối đa 40 bước

            ClearInterval(gInterval);
            // sau đó làm gì với ma?

        } khác {

            $ghosts.removeClass('step'+(num-1)).addClass('step'+num);
            số++;

        }

}, 250);

Đây không phải là một giải pháp tốt và không tận dụng được sức mạnh của CSS3, nhưng IE đã làm điều này trở nên dễ dàng như vậy từ khi nào?

Về vị trí nền hoạt hình CSS trong IE11, chúng tôi đã tìm thấy một câu hỏi tương tự trên Stack Overflow: https://stackoverflow.com/questions/57029584/

33 4 0
Bài viết khuyến nghị: linux - Lệnh netcat hoặc nc hoạt động như thế nào dựa trên giao thức mạng hoặc cổng?
Bài viết khuyến nghị: Lỗi phân tách cấu trúc và con trỏ trong C
Bài viết khuyến nghị: Làm cách nào để cài đặt Python 2.6 trong CentOs 7?
Bài viết khuyến nghị: Python CSV chuyển đổi dữ liệu trong một cột thành hàng
không gian vũ trụ
Hồ sơ

Tôi là một lập trình viên xuất sắc, rất giỏi!

Nhận phiếu giảm giá taxi Didi miễn phí
Phiếu giảm giá taxi Didi
Các bài viết phổ biến trên toàn bộ trang web
Chứng chỉ ICP Bắc Kinh số 000000
Hợp tác quảng cáo: 1813099741@qq.com 6ren.com
Xem sitemap của VNExpress