File preview on Hover in Sharepoint Online lists JSON

Hi conny82 ,

Do you want to have a custom preview from Name column?

I already tuned your code a little bit and now it displays hover on a separate column and generates also thumbnail on it. Your code also had one "elmtype" element, which I changed to elmType. Remember to be precise with capitalization. I also added isBeakVisible attribute to customCardProps element, which enables that little beak pointing to selected line.

{
    "$schema": "https://developer.microsoft.com/json-schemas/sp/column-formatting.schema.json",
    "elmType": "img",
    "attributes": {
        "src": "@thumbnail.medium"
    },
    "style": {
        "display": "block",
        "margin": "0 auto",
        "max-height": "80px"
    },
    "customCardProps": {
        "openOnEvent": "hover",
        "isBeakVisible": true,
        "formatter": {
            "elmType": "img",
            "attributes": {
                "src": "@thumbnail.500x500"
            },
            "style": {
                
                
                "max-height": "500px"
            }
        }
    }
}