Pens from Timothee Guignard https://codepen.io/TimGuignard/ en nospam@codepen.io Copyright 2024 2018-06-27T19:09:50-07:00 Animate a Bootstrap Grid (JS/CSS) https://codepen.io/TimGuignard/pen/yERGbG https://codepen.io/TimGuignard/pen/yERGbG Timothee Guignard

See the Code - See it Full Page - See Details

Here is an exemple of a Bootstrap Grid animation. This is very simple, with a toggle button. It can of course be adjusted for a window.resize or anything else. I just wanted try how to do it, how to structure the idea. The code itself is probably not the best ever though ^^. The same idea can be used for any grid system, or even a personal one. Still need to be improved (especially when scrolling during the animation). (Of course, the filters on the left are there as a pretext, they don't work)

]]>
Animate a Bootstrap Grid (JS/CSS) 2018-06-27T19:09:50-07:00
Facebook Messenger Chat https://codepen.io/TimGuignard/pen/wgOXjr https://codepen.io/TimGuignard/pen/wgOXjr Timothee Guignard

See the Code - See it Full Page - See Details

The Facebook Messenger chat. You can type, or you can try the like that works like the messenger one: keep clicking to expand the size of the thumb

]]>
Facebook Messenger Chat 2017-08-18T16:27:41-07:00
SVG / CSS animation - checkbox https://codepen.io/TimGuignard/pen/NdzXyQ https://codepen.io/TimGuignard/pen/NdzXyQ Timothee Guignard

See the Code - See it Full Page - See Details

Having fun with some SVG animations path

]]>
SVG / CSS animation - checkbox 2018-06-27T18:11:44-07:00
Full CSS checkbox https://codepen.io/TimGuignard/pen/pRKdvV https://codepen.io/TimGuignard/pen/pRKdvV Timothee Guignard

See the Code - See it Full Page - See Details

A full css checkbox button. You'll find: - SVG Background -css transition - pseudo element - no JS

]]>
Full CSS checkbox 2017-02-06T12:50:56-07:00
iOS Checkbox toggle - CSS https://codepen.io/TimGuignard/pen/mRLKBe https://codepen.io/TimGuignard/pen/mRLKBe Timothee Guignard

See the Code - See it Full Page - See Details

A full CSS checkboxes (radio), iOS style.

]]>
iOS Checkbox toggle - CSS 2017-02-05T18:52:42-07:00