Sosial Media
0
News
    Home Tools

    Tool check Responsive cho website

    3 min read

    • ✨ Tool kiểm tra responsive cho website của anh em!
    • 👉 Chỉ cần nhập link web rồi bấm CHECK.
    • 👉 Chọn chọn kích thước, có thể xoay ngang dọc tùy thích.
    10 nhận xét
    kiểu như load chỗ mục lục, sidebar, với chỗ liên kết link nó còn có độ trễ á, kiểu nó ko có mượt, tại thấy vậy nên mới nói cà giựt á ☺
    À, nhìn nó cà giựt do không cố định style trước khi nó hiển thị 😁
    Có tip nào hướng dẫn comment link ảnh như Bình luận mà nó tự hiển thị ảnh luôn không ông?

    Test: https://res.cloudinary.com/dxahoq7x4/image/upload/v1759201702/vgnb9bnmh5ad2oks8iuk.png
    ý nó hiện ảnh kìa, cho tui xin code hoặc viết bài hướng dẫn đi ông
    [pre]<script>
    //<![CDATA[
    (function(){
    const URL_RE=/\bhttps?:\/\/[^\s<>"']+/gi, IMG_EXT=/\.(jpe?g|png|gif|webp|avif|bmp|svg)(\?|#|$)/i;

    function resolveHref(h){
    try{
    const u=new URL(h,location.href);
    if(u.hostname==='www.blogger.com'&&u.pathname.includes('/redirect')){
    const real=u.searchParams.get('url'); if(real) return decodeURIComponent(real);
    }
    return u.href;
    }catch(_){return h||''}
    }

    function makeImg(src,alt){
    const img=document.createElement('img');
    img.src=src; img.alt=alt||''; img.loading='lazy'; img.decoding='async';
    img.style.maxWidth='100%'; img.style.display='block'; img.style.marginTop='8px';
    img.onerror=()=>img.remove();
    return img;
    }

    function linkifyAndReplace(container){
    const walker=document.createTreeWalker(container,NodeFilter.SHOW_TEXT,null);
    const texts=[]; while(walker.nextNode()) texts.push(walker.currentNode);
    texts.forEach(t=>{
    if(!t.nodeValue||!URL_RE.test(t.nodeValue)) return;
    URL_RE.lastIndex=0;
    const frag=document.createDocumentFragment();
    let s=t.nodeValue, m, i=0;
    while((m=URL_RE.exec(s))){
    if(m.index>i) frag.appendChild(document.createTextNode(s.slice(i,m.index)));
    const url=m[0], img=makeImg(url,'');
    frag.appendChild(img); i=m.index+url.length;
    }
    if(i<s.length) frag.appendChild(document.createTextNode(s.slice(i)));
    t.parentNode.replaceChild(frag,t);
    });
    }

    function replaceAnchors(area){
    area.querySelectorAll('a[href]').forEach(a=>{
    if(a.dataset.imgInjected==='1') return;
    const src=resolveHref(a.getAttribute('href'));
    const img=makeImg(src,a.textContent.trim());
    a.insertAdjacentElement('afterend',img);
    a.remove();
    });
    }

    function process(root){
    root.querySelectorAll('.comment-content').forEach(area=>{
    linkifyAndReplace(area);
    replaceAnchors(area);
    });
    }

    function boot(){
    process(document);
    const mo=new MutationObserver(ms=>{
    ms.forEach(m=>{
    m.addedNodes&&m.addedNodes.forEach(n=>{
    if(!(n instanceof Element)) return;
    if(n.matches?.('.comment-content,#comments,.comments,#comment-holder')) process(n);
    else {
    const found=n.querySelectorAll?.('.comment-content');
    if(found&&found.length) process(n);
    }
    });
    });
    });
    mo.observe(document.body,{childList:true,subtree:true});
    }

    if(document.readyState==='complete') boot();
    else window.addEventListener('load',boot);
    })();
    //]]>
    </script>[/pre]
    Thay class, id cho đúng nha
    Gắn vào chạy luôn rồi, thanks nha 👍
    Tại lúc làm chưa biết ảnh đuôi webp là gì? 😁
    Đã update 😁
    ủa ông cái đoạn code này nó chặn luôn link trên comment à
    Nó đang chặn như nào nhỉ? Chưa hiểu ý ông
    Additional JS