From d4a052e86f33ced79b9f4d09aeee0b1c43ef1f23 Mon Sep 17 00:00:00 2001 From: Jieiku Date: Tue, 31 May 2022 01:45:54 -0700 Subject: Improve imghover shortcode, examples, page scores --- content/overview-fonts-imagehover-shortcode/index.md | 18 +++++++++++++++--- 1 file changed, 15 insertions(+), 3 deletions(-) (limited to 'content/overview-fonts-imagehover-shortcode') diff --git a/content/overview-fonts-imagehover-shortcode/index.md b/content/overview-fonts-imagehover-shortcode/index.md index 655b6cd..448c7f0 100644 --- a/content/overview-fonts-imagehover-shortcode/index.md +++ b/content/overview-fonts-imagehover-shortcode/index.md @@ -7,9 +7,21 @@ categories = ["Features"] tags = ["shortcodes","image"] +++ -This shortcode accepts an array of images, the first element is the default, the remaining images are hover images. +This shortcode accepts an array of images, the first element is the one you are comparing to all the others. + +The first image in the array is displayed, hover you mouse over the image to display the one your comparing to. -with `imagehover(sources=["file1.jpg", "file2.jpg", "file3.jpg"])` +This can also be used to compare just one picture with another by passing only two files in the array: + +`imagehover(sources=["regular.png", "hover.png"] w=560 h=650 p=45` + +To Compare many images just add more images to the array: + +`imagehover(sources=["System.png", "DroidSans.png", "Roboto.png", "Arimo.png", "Lato.png", "Ubuntu.png"] w=560 h=650 p=45` + +- w is the width of the image. +- h is the height of the image. +- p is the percent size that you want the image to use on the page.(50 is the default) -{{ imagehover(sources=["System.png", "DroidSans.png", "Roboto.png", "Arimo.png", "Lato.png", "Ubuntu.png"]) }} +{{ imagehover(sources=["System.png", "DroidSans.png", "Roboto.png", "Arimo.png", "Lato.png", "Ubuntu.png"] w=560 h=650 p=45) }} -- cgit v1.3.1