Click on thumbnails below to see showMe in action !

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.[...]

ShowMe open :
• jpg, jpeg, gif, png and webp (if browser accepts it)
• mp4 movies
• html contents
• pdf

ShowMe use :
• Color Thief v2.0 by Lokesh Dhakar (embeded directly in showMe script, you don't need to embed yourself)
• jquery v3.1.1

How to install showMe :
• Insert link to jquery and ShowMe librairies in the head of your web page
• Assign the class "showMe" at element you want it be open as slideshow
• showMe grabs the "href" of these elements, analyse them and opens its in slide show
• Title of links is shown at the bottom of the screen when slideshow is on
• if attribute "data-link" is filled, a link is put on picture and a click on it send user towards this link
• if attribute "data-gps" is filled, the symbol ⌖ is put at the bottom of the screen to link towards a maps with gps coordinates
• For html content, "href"" must end with "showMe_html" and you have to add attribut called "data-showMeRel" which contains id of element which will be displayedn in the slideshow
• Javascript parameters you can add in your web page :
  • var showMe_backgroundColor='#1e1e1e';
    color of gradient bottom of ambilight, background of picture with no ambilight,html content and movie background
  • var showMe_ambilight=1;
    0 : No ambilight, background color is equal to showMe_backgroundColor
    1 : background color is tuned with main color of picture
    2 : A nebula atmosphere based on picture is used to fill the background (beautifull but transition will probably be slower)
  • var showMe_backgroundColorGradient=true;
    Background color is graded from 'showMe_backgroundColor' to main color of picture if showMe_ambilight is true
  • var showMe_effect='slide';
    Effect shown between 2 pictures changes : 'slide', 'fade' or 'nothing'
  • var showMe_speedEffect=200;
    Speed effect in milliseconds
  • var showMe_backgroundOpacity=1;
    Opacity of background. Let see or not the web page under
  • var showMe_GpsLink='https://www.google.com/maps/place/';
    Map link which accept gps coordinates like : -8.8961111111111,116.28888888889

Others informations :
• Pre-loading elements for faster loading
• You can make a link directly to a picture if you add "#showMeidPicture" at the end of url : Try it
• "Right", "left" and "escape" on your keyboard have actions on slideshow