Image Test

!
Images have a similar syntax to links but include a preceding exclamation point. ❕
1
![Alt text](https://octodex.github.com/images/stormtroopocat.jpg "The Stormtroopocat")

./images/stormtroopocat.jpg
The Stormtroopocat

1
![Alt text](https://octodex.github.com/images/stormtroopocat.jpg)

./images/stormtroopocat.jpg

Click to fold

./images/stormtroopocat.jpg
The Stormtroopocat

1
2
3
{{< admonition type=info title="Click to fold" open=true >}}
![The Stormtroopocat](./images/stormtroopocat.jpg "The Stormtroopocat")
{{< /admonition >}}

image shortcode is an alternative to figure shortcode. image shortcode can take full advantage of the dependent libraries of lazysizes and lightgallery.js.

1
{{< image src="images/stormtroopocat.jpg" caption="The Stormtroopocat" linked=true >}}

The rendered output looks like this:

/image-test/images/stormtroopocat.jpg
The Stormtroopocat
1
2
3
{{< admonition type=info title="Click to fold" open=true >}}
{{< image src="images/stormtroopocat.jpg" caption="The Stormtroopocat" linked=true >}}
{{< /admonition >}}

The rendered output looks like this:

Click to fold
/image-test/images/stormtroopocat.jpg
The Stormtroopocat

Question
I ran into a strange problem that I’m not sure how to resolve for the time being. Images shortcode does not function properly in admonition shortcode and only displays a link to the image (see below). Surprisingly, only one computer (my laptop) has this issue. That is, somehow because Scale and Layout of  Windows Display is set to 150 %, therefore the symptom occurs globally in all browsers, instead of just one. Fortunately, images load normally on other devices (desktop PC, phones, and tablets).

The image  below only shows a link, but changing the zooming level of the browser forces it to show, however.

/images/lazyload_bug.png