[?] - Ad - Hình ảnh bị tràng khi xem ở chế độ mobile

 Các vấn đề khác

NK4.0.29(Module Lưu bút ) Ad- Cho hỏi khi dùng trình soạn thảo chèn hình ảnh vào bài viết thì xem ở di động nó bị tràng hình ảnh thì khắc phục bằng cách nào vậy bác Triển? Như hình

Cảm ơn bác trước nha! :)


Bạn có thể tham khảo cách xử lý của news nhé, tự động resize ảnh trong nội dung bằng js
https://github.com/nukeviet/nukeviet/blob/develop/themes/default/js/news.js#L60


Cảm ơn bác Triển nhé! Mình nghiên cứu xem sao!


Bác có thể hướng dẫn đôi chút về các file liên quan bị ảnh hưởng bởi code js này được không bác và có php gì không bác!?


Toàn bộ của nó là đoạn này thôi bạn. Bạn lưu ý chổ này #news-bodyhtml, đây là element của thẻ bao ngoài phần nội dung, bạn sửa lại html trang chi tiết cho phù hợp.

function fix_news_image(){
    var news = $('#news-bodyhtml'), newsW, w, h;
    if( news.length ){
        var newsW = news.innerWidth();
        $.each($('img', news), function(){
            if( typeof $(this).data('width') == "undefined" ){
                w = $(this).innerWidth();
                h = $(this).innerHeight();
                $(this).data('width', w);
                $(this).data('height', h);
            }else{
                w = $(this).data('width');
                h = $(this).data('height');
            }

            if( w > newsW ){
                $(this).prop('width', newsW);
                $(this).prop('height', h * newsW / w);
            }
        });
    }
}

$(window).on('load', function() {
    fix_news_image();
});

$(window).on("resize", function() {
    fix_news_image();
});

Cảm ơn bạn! Mình đã khắc phục được nhưng chưa tối ưu lắm vẫn còn thừa tí. Nhưng cũng tốt hơn trước rất nhiều!

Bạn cần đăng nhập để tham gia thảo luận

Trung tâm ứng dụng NukeViet
Ghi rõ nguồn khi sao chép thông tin từ website này.

Powered by NukeViet - a product of VINADES.,JSC