Before and After Slider For Photography Blog PostsAs a photographer there are oftentimes when you want to display a "Before" and "After" comparison. Or to make a more compelling website/blog post you need to have a unique way of displaying two images. Frequently you'll see a side-by-side comparison. While this does the trick, it's just not nearly as FUN as a SLIDER (SEE THE VERY BOTTOM EXAMPLE). Examples of sliders: And this example where I got enormous help from Bertrand. The link where I saw a slider for the first time was this post. Great examples of when to use this are pre and post Photoshop/Lightroom, comparing the same people at different points in time (which is what my example displays), and construction photos of a home in progress. To create this you do have to have some ability to do HTML and specifically JQuery. If you do not, then you may want to hire a designer who can help you do this. My Example: Now I could just post the two photos I want to show like this (these are images taken 4 years apart):
NOW CHECK IT OUT! Doesn't this BEFORE and AFTER Slider make a nice impact? A HUGE thank you to Bertrand Hui Photography for his guidance in showing me how to do this. THANK YOU! Just move the red slider back and forth - cool isn't it? Questions or comments? Feel free to leave them below!
Comments
No comments posted.
Loading...
|
Get a free gift when you buy a bag! What's in my favorite Thinktank Bag?
|
January
February
March
April
(3)
May (3)
(3)
June (3)
(5)
July (5)
(4)
August (4)
(2)
September (2)
(3)
October (3)
(3)
November (3)
(1)
December (1)
|
(2)
January (2)
(1)
February (1)
(1)
March (1)
(2)
April (2)
(4)
May (4)
June
(2)
July (2)
(2)
August (2)
(2)
September (2)
October
(2)
November (2)
(1)
December (1)
|
(1)
January (1)
(4)
February (4)
(4)
March (4)
(7)
April (7)
(4)
May (4)
(3)
June (3)
(5)
July (5)
(3)
August (3)
(2)
September (2)
(3)
October (3)
(2)
November (2)
(1)
December (1)
|
(3)
January (3)
(1)
February (1)
(3)
March (3)
(3)
April (3)
(4)
May (4)
June
(1)
July (1)
(1)
August (1)
September
(2)
October (2)
(2)
November (2)
(1)
December (1)
|
(1)
January (1)
(2)
February (2)
March
(1)
April (1)
(1)
May (1)
(1)
June (1)
July
August
(2)
September (2)
October
(1)
November (1)
(2)
December (2)
|
January
February
(3)
March (3)
April
May
(1)
June (1)
(2)
July (2)
(1)
August (1)
(1)
September (1)
October
November
December
|
January
February
(1)
March (1)
April
(1)
May (1)
(1)
June (1)
(1)
July (1)
August
September
October
November
(1)
December (1)
|
January
February
March
April
May
June
July
August
September
October
November
December
|
January
February
March
April
May
June
July
August
September
October
November
December
|
January
February
March
April
May
June
July
August
September
October
November
December
|
January
February
March
April
May
June
July
August
September
October
November
December
|
January
February
March
April
May
June
July
August
September
October
November
December
|