How to display fancybox in Bitrix?

Question

1C-Bitrix

good afternoon!
Below is the code for displaying an image,
how to make it display a larger image when clicked

<?if ($arResult["QUESTION"]["FILE"] !== false):?>
        <br /><br />
<img src="<?=$arResult["QUESTION"]["FILE"]["SRC"]?>" width="40%" height="60%" />
      <?endif?>

Answer 1

Well, connect the fancybox js and css files of the plugin to the template. Wrap your img in a link to which the fantasybox will be initialized, put a link to a large image in the href attribute of this link.

Answer 2

The fancybox demo has a preview image and a detailed one: You need to adjust the code to reflect this. It is better not to use large pictures. And to do an auto-resize of the picture of your QUESTION property, where to display a small picture in the preview, and to enlarge the detailed original.