Jump to content

Archived

This topic is now archived and is closed to further replies.

leftcoastmichael

Videos in Full-Width Rev Slider?

Recommended Posts

leftcoastmichael

Hi.  I'm trying to imbed a video into my RevSlider but getting an error message from Vimeo, "Sorry there was a problem loading this video."  The Video on Vimeo is 1280 x 720 but I resized it to fit the RevSlider using this code, which i snatched from the RevSlider documentation sample code ( http://www.orbis-ingenieria.com/code/documentation/documentation.html#!/layout ).  Here's the code I used:

li data-transition="slideup" data-slotamount="20">
<img src="images/slides/image20.jpg"  >
                                <div class="caption lfb boxshadow" data-x="70" data-y="120" data-speed="900" data-start="500" data-easing="easeOutBack"><iframe src="http://player.vimeo.com/video/72601988" width="1068" height="601" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe></div>
 
                                <div class="caption lfb medium_grey"  data-x="550" data-y="258" data-speed="300" data-start="1600" data-easing="easeOutExpo">to your Slides</div>
 
</li>

I suspect it might be stalling at the load because the code snippet refers to an img src that is not on my site?

 

Two questions:

 

1)  How do I fix this to show the video?  

 

2) I'm not really up on the CSS options for videos, but I can see there are plenty being referred to in the code snippet.  Is there some source, summary, or 'cheat sheet' I can use that gives me the options available?  For example, the code refers to data x andy, data speed (what is that?), data start (hmm, miliseconds after loading?), data easing (no idea what that means), data transition, data slotamount, etc...

 

What I would LIKE to have happen on this slide, (a) for the slide sequence to stop here (not loop), and (b) have an OPTION to START the video. 

 

Thanks in advance...

 

Share this post


Link to post
Share on other sites
Danny

Hi,

 

The code you used isn't correct, firstly, you're missing a &amp;lt; infront of your li&amp;gt; at the beginning of your code.

 

Also, from what I can tell, you're not using the correct embed code for your video. You can get this from Vimeo.

 

I add the following code and I get a video to display just fine with a background image too.

 

The data instructions are all provided on the RevSlider documentation, here is quick copy and paste of these instructions,

 

data-x The horizontal position in the standard (via startwidth option defined) screen size (other screen sizes will be calculated)
data-y vertical position in the standard (via startheight option defined) screen size (other screen sizes will be calculated)
data-speed duration of the animation in milliseconds
data-start after how many milliseconds should this caption start to show
data-easing special easing effect of the animation

Here is the code I used for my text.

https://gist.github.com/Dannyholt/3b3ce95a1017bc1edcf7


Please search our forums, before posting!

Share this post


Link to post
Share on other sites
leftcoastmichael

Thanks Danny. I really must be blind, This is the second time you've seen something that I have not!  Appreciate your patience.

Share this post


Link to post
Share on other sites
leftcoastmichael

Danny, your code snipped does work fine.  I then tried dropping in the iframe code from another video, into the code that you provided, but it seems not to work. The error message says "video does not exist."

<img src="http://larryfire.files.wordpress.com/2013/04/disney-pixar-compilation-image-1519560.jpg">
    <div class="caption lfb boxshadow" data-x="70" data-y="120" data-speed="900" data-start="500" data-easing="easeOutBack"><iframe src="http://player.vimeo.com/video/72594845" width="500" height="281" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe> <p><a href="http://vimeo.com/72594845">SmartTime Logic</a> from <a href="http://vimeo.com/user20263678">Michael</a> on <a href="https://vimeo.com">Vimeo</a>.</p></div>
    <div class="caption lfb medium_grey"  data-x="550" data-y="258" data-speed="300" data-start="1600" data-easing="easeOutExpo">to your Slides</div>

Share this post


Link to post
Share on other sites

  • Similar Content

    • jeomiland
      By jeomiland+
      Greetings
      I just migrated an old DMS2 site to PL5 at cassClayton.com. If you look at the site on Safari browser, you will see the top nav bar (NavPro) is white, but gets revealed as you start to scroll the page. NavPro is used in the Header section, then a Text section in which I have Shortcode for the Smart Slider3 plugin. Would have preferred to use a PL-compatible slider but found it difficult to get Flick and Impress slider to simply fill full screen, just height of images (they were filling whole screen, hence large black area filling in the rest).
      So seems on Safari that the load order of the plugin may be causing the Nav bar to be overwritten? or something. 
      Hoping someone can help?
      thanks...  (works fine on Chrome, Firefox, even Tor, just not Safari)
    • Steve Webb
      By Steve Webb+
      I am having an issue with DMS editor not loading.  Just keeps spinning and spinning.
      Have tried several things - Logged in and out, cleared cache, deactivated all plugins, but the issue persists.
      I even had our host restore from a backup a few weeks ago, when I know it WAS working, as I edited a text box on the homepage.  The restore from backup didn't help either.
      Also, the front end of the site shows that the site is framed, or boxed now (whatever you call it), instead of full width as it was previously (last week).
      Dev console shows that there are php errors in Google maps - file is attached.
      Can someone please help?  Not sure what else I can do here...
      Thanks in advance.
      -Matt

    • tuciudadenred
      By tuciudadenred+
      Hi everyone, what happens is that the web page metrosalarmas.com has a google tags which I have not attacked where I can look to remove those tags and be able to locate the correct ones.
    • Steve Webb
      By Steve Webb+
      I am having an issue with DMS editor not loading.  Just keeps spinning and spinning.
      Have tried several things - Logged in and out, cleared cache, deactivated all plugins, but the issue persists.
      I even had our host restore from a backup a week ago, when I know it WAS working, as I edited a text box on the homepage.  The restore from backup didn't help either.
      Also, the front end of the site shows that the site is framed, or boxed now (whatever you call it), instead of full width as it was previously (last week).
      Dev console shows that there are php errors in Google maps - file is attached.
      Can someone please help?  Not sure what else I can do here...
      Thanks in advance.
      -Matt

    • JawDesigns
      By JawDesigns
      Hi everyone,
      Flywheel have reported errors on my clients site 'www.racewaredirect.co.uk' and it's not loading. Can someone please provide some information on how to fix this? The site has never experienced these issues before.
      Thanks,
      James Wilson
×