Greg’s Sandbox

Notes on Front-End Web Development

25 Jan modified: 3 years ago

Simple CSS Image Slider

graphics html istock Photo

Cookbook tutorial for a CSS image slider containing four images. Relies on the jQuery plug-in named "Slidy". Rather crude, but it does seem to work with minimal set up... just some keyframe rules in the _custom.scss file.

Perhaps it might be worthwhile to explore the GSAP version of this technique? Definitely, but I'll need to wait until I have more skills to tackle that project. Reference files for GSAP technique are found at:

C:\Users\Gregory Chambers\_gProjects\GSAP_Instruction\gregGSAP_Class\Image Slider

Start by placing the images into this folder.

Continue reading Simple CSS Image Slider...

21 Jan modified: 3 years ago

Creating a Simple Gallery

graphics Corbis photos

Technique to display a bunch of photographs (with captions and descriptions - if needed) on a simple gallery page. This takes advantage of Grav's media functionality which allows a page to be aware of the images available in it's folder. The images placed in the enclosing folder will be stored and d…

Continue reading Creating a Simple Gallery ...

18 Jan modified: 3 years ago

Manipulating Images Within a Post

grav graphics istock photo

Image files can be manipulated in a variety of ways from within Grav. It supports image manipulation by using a number of extensions added to the image link. The following examples will be an exploration of these methods.

To begin with, images can be stored either in the same folder as the post OR i…

Continue reading Manipulating Images Within a Post ...