• Gear
  • Shots
  • Photo Craft
  • Video
  • Wide Angle
  • Support
  • New Stuff
  • More
Support Legacy SmugMug Customization FastLine Media's Full-Screen Slideshow Tutorial

Need some help with your New SmugMug Site?

Dgrin Challenges

They're back! Our latest series of Dgrin Challenges, the OOYCZ Challenges (Out of Your Comfort Zone), is a series of challenges to help you improve your photography by stepping out of your comfort zone and trying something new. Our challenge leader says "Consider it like a photography class with no diplomas.". Get started with OOYCZ by reading the Challenge Guide.

Past DSS Challenge Winners, DSS Challenge Rules, and other important DSS Challenge information is here.

Looking for a little challenge? The Dgrin Mini-Challenges are a great way to challenge yourself. Take a moment to look through past winners and find the current Mini Challenge here.

From Around the Net

Enjoy a few of our favorite articles from around the 'net. If you have something you think we should see, post it here and we'll have a look.

Journeys

Landscapes

Sports

 
Thread Tools Display Modes
Page 1  of  68
1 2 3 4 5 11 51 Last »
Old Feb-07-2011, 07:57 PM
#1
Justin B is offline Justin B OP
Web Designer
Justin B's Avatar
FastLine Media's Full-Screen Slideshow Tutorial
If you are looking for a "full screen" or "supersized" HTML5 slide show on your SmugMug home page like this or this, you are in the right place. In addition to the slide show, the CSS for this tutorial will also customize a header made with the easy customizer to be full width and have an optional transparent background.

The Tutorial

You can find the tutorial for this slideshow on our blog here.

Problems or Questions

If you're having trouble with the slideshow or have questions about tweaking it, check out our fullscreen slideshow FAQ first. Post to this thread if you don't find your answers there and I'll answer as soon as I can (sometimes I'm really busy, sometimes I can answer quickly). Don't forget to show us your site when you get it up and running!

Additional Properties

For a full list of available properties that allow you to tweak the slideshow, check out this PDF.

Upgrading from a previous version.

The current version is 1.1.0 and was released on November 5, 2012.

Download the latest version of the slideshow code at this link.

To upgrade your FastLine slideshow you will need to replace the compressed JavaScript while leaving the JavaScript that creates the slideshow intact. Not sure what the heck that means? No worries!

The JavaScript you want to leave intact is at the top of the FastLine code and starts and ends like this…



The JavaScript you need to replace is a jumbled mess and looks something like this…



Once you have replaced the JavaScript, click update in the advanced customizer and you're done.

Please note the following before posting for help…

This tutorial is for customizing the slideshow and header on the homepage only. Also, we are only offering support for the CSS layout provided. If you are looking to do something different, search or ask around. There is a lot of good info floating around this place!

Feel free to tell us your opinions or give us feedback on the slideshow. We hope you enjoy it!
Old Feb-07-2011, 08:29 PM
#2
eric-holmes is offline eric-holmes
Major grins
eric-holmes's Avatar
I would just like to say thanks once again. I have loved my site even more since I have done this! I get tons of compliments now. Feel free to check it out.

http://www.ericholmesphotography.com
__________________
www.ericholmesphotography.com
Old Feb-08-2011, 05:47 AM
#3
eman11 is offline eman11
Beginner grinner
All these full screens look great! Guess I'm missing a step (I've been up long now!) but I can get the slideshow to work. In the CSS area should I take all code out and just put this one in? Right now I have the code in to show the homepage as a slideshow but when I put the other in (before or after) everything goes blank but the bottom. Much thanks in advance!

Eman
http://www.efouru.smugmug.com/
http://www.efouru.com
Old Feb-08-2011, 07:05 AM
#4
Justin B is offline Justin B OP
Web Designer
Justin B's Avatar
Quote:
Originally Posted by eman11 View Post
All these full screens look great! Guess I'm missing a step (I've been up long now!) but I can get the slideshow to work. In the CSS area should I take all code out and just put this one in? Right now I have the code in to show the homepage as a slideshow but when I put the other in (before or after) everything goes blank but the bottom. Much thanks in advance!
Before I can tell what's going on you will need to put in all the code for the tutorial. Put the CSS in for now and then we'll see if there are any problems. You are also missing the album id in the JavaScript.
Old Feb-08-2011, 05:30 PM
#5
em8ch is offline em8ch
Big grins
I'm having some trouble with my slideshow in Internet explorer. I was making some updates and now my slideshow doesn't work in internet explorer. Any ideas?
Old Feb-08-2011, 07:27 PM
#6
Justin B is offline Justin B OP
Web Designer
Justin B's Avatar
Quote:
Originally Posted by em8ch View Post
I'm having some trouble with my slideshow in Internet explorer. I was making some updates and now my slideshow doesn't work in internet explorer. Any ideas?
You have an extra comma in the property list for the slideshow. Remove the comma on this line...

viewerItemDropShadow:'',

The last item in any JavaScript list must never have a comma or it will break.
Old Feb-08-2011, 07:42 PM
#7
em8ch is offline em8ch
Big grins
Thanks Justin, I made that update, but I still was unable to get the slideshow to work in ie
Old Feb-08-2011, 07:57 PM
#8
Justin B is offline Justin B OP
Web Designer
Justin B's Avatar
Quote:
Originally Posted by em8ch View Post
Thanks Justin, I made that update, but I still was unable to get the slideshow to work in ie
I might have a bug. Can you try removing the pound sign from the backgroundColor property?
Old Feb-08-2011, 08:06 PM
#9
em8ch is offline em8ch
Big grins
That seemed to do the trick!! Thanks!!

I don't suppose you know how to only show the transparent bar when you hover over the navbar do you?
Old Feb-08-2011, 09:10 PM
#10
eman11 is offline eman11
Beginner grinner
Thank you. I have put those items in and the homepage is now blank, with just the wording at the bottom. Thank you for looking!
Old Feb-08-2011, 09:43 PM
#11
Justin B is offline Justin B OP
Web Designer
Justin B's Avatar
Quote:
Originally Posted by eman11 View Post
Thank you. I have put those items in and the homepage is now blank, with just the wording at the bottom. Thank you for looking!
You still need to put an album id in the JavaScript. Check the tutorial for how to do that and let me know if it's still not working.
Old Feb-09-2011, 06:14 AM
#12
angevin1 is offline angevin1
Performs as designed
angevin1's Avatar
Went to your Website, dl, install..easy! Thanks!!
Old Feb-09-2011, 06:48 AM
#13
eman11 is offline eman11
Beginner grinner
Thank you for looking and sorry that I seem to be missing something, but still no luck. Help
Old Feb-09-2011, 06:59 AM
#14
eman11 is offline eman11
Beginner grinner
My my my! I got it!! Thank you! Thank you, it's great!
Old Feb-09-2011, 01:50 PM
#15
eric-holmes is offline eric-holmes
Major grins
eric-holmes's Avatar
How about adding a splash page for people with a slow load internet? It would beat looking at a blank screen.
__________________
www.ericholmesphotography.com
Old Feb-09-2011, 10:59 PM
#16
ricstew is offline ricstew
Big grins
I must be missing something. I feel its something in the css but cant work out what :( I am pretty sure I have the gallery settings correct, put in the stuff from the tutes but I am still not getting it. ( insert nail tapping here !) Its driving me batty.
When I hit the back button it tells me the preview failed to load?
http://janstewartphotography.smugmug.com/
cheers
Jan

I got it! one little / mark in the gallery no.......now off to sort the header........you guys are awesome. Why didn't someone tell me this could be fun

Last edited by ricstew; Feb-10-2011 at 12:48 AM.
Old Feb-10-2011, 01:56 PM
#17
maximus96 is offline maximus96
Big grins
maximus96's Avatar
I second the splash page idea, how does one go about incorporating that into the script? thanks nevermind, found there there is a line in there to load a splash page.

Last edited by maximus96; Feb-10-2011 at 02:46 PM.
Old Feb-10-2011, 03:07 PM
#18
Justin B is offline Justin B OP
Web Designer
Justin B's Avatar
Quote:
Originally Posted by eric-holmes View Post
How about adding a splash page for people with a slow load internet? It would beat looking at a blank screen.
The loadingImage property isn't really setup to be used as a splash image but it's a great idea. It may already work just fine. I've never tested it for that purpose but you can guarantee it will be in the next release
Old Feb-10-2011, 03:12 PM
#19
maximus96 is offline maximus96
Big grins
maximus96's Avatar
the loadingImage works fine to load up a X2 size or so picture before the rest of the slideshow loads. I tried to make the full width header work but it doesn't. i copied both transparent background and full width header scripts to the CSS box but only the background part worked. i pasted the full width header last, does that matter? the header is made with the easy customizer. thanks sammylophotos.com
Old Feb-10-2011, 07:55 PM
#20
Justin B is offline Justin B OP
Web Designer
Justin B's Avatar
Quote:
Originally Posted by maximus96 View Post
the loadingImage works fine to load up a X2 size or so picture before the rest of the slideshow loads. I tried to make the full width header work but it doesn't. i copied both transparent background and full width header scripts to the CSS box but only the background part worked. i pasted the full width header last, does that matter? the header is made with the easy customizer. thanks sammylophotos.com
The loading image looks good. I'll probably make some adjustments to that in the next release so it fades in nicely.

It looks like you have an error in your css. The following is not a legal css comment...

/---end full screen

Remove that and see if that helps.
Page 1  of  68
1 2 3 4 5 11 51 Last »
Tell The World!  
Tags
fastline , slideshow , smugmug , smugmug customization
Similar Threads Thread Starter Forum Replies Last Post
Customize the full screen slideshow? brantaleu Legacy SmugMug Customization 2 Dec-08-2010 03:11 PM
Customizing the Full Screen Slideshow mudhouse Legacy SmugMug Customization 3 Dec-26-2009 08:46 PM
Making images in Full Screen slideshow non-clickable? CharlesSA Legacy SmugMug Customization 0 Oct-20-2009 02:06 AM
augh...slideshow -no full screen dbaker1221 Legacy SmugMug Customization 2 May-17-2007 03:10 AM
Recent Changes In Full Screen Slideshow? SamirD SmugMug Support 4 Jun-21-2006 05:50 AM


Thread Tools
Display Modes

Posting Rules  
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump