Slider question - mixing images and video

i am trying to mix still images and youtube videos into the front page slider. the problem is that the videos are always scaled up full screen for the sliders, which is not the same size as the other still images. this causes the remainder of the website to move up and down as the slider height changes with each slide between still images and videos.

is there a way to have the videos not scale up full screen, but instead be at its native playback size, and overlay on top of a background slider image? or can you think of a way to set the video image height manually so that it can match the other slider image heights?

this popping up and down of the rest of the website everytime the slider changes from images to videos is very annoying.

thanks,
-jim

 

Hello Jim,

YouTube video embed code contain height and width.
You can adjust it's height from there.

Thanks & Regards
Nitesh Raghuwanshi

 

thanks nitesh.
yes i know about the embed code height and width. the problem is.....
-if you set the height and width smaller, the video image appears on the upper left corner of the webpage slider area, not in the center. it should appear centered in the slider window area.
-if you use html5 instead of flash, which is an option in youtube embed code, the image is always full screen scaled, which causes the website to slide down.

thanks,
-jim

 

Hello jim,

Black border at the video bottom is covering extra space. Which is moving site up and down.
We can stop slider auto adjust feature.
For it your need to edit theme's internal file "custom.js"
Install "wp-editor" plugin and then go to the Appearance > Theme editor > custom.js.
And make changes as shown in the image.



After that Paste this code in Custom CSS
Appearance > Theme Option > Styling Option > Custom CSS

Code:

.videoWrapper {
padding-bottom: 54.58%; /* 16:9 */
}

Upload slider images of ration 16:9.
I hope it will work if not then please share your website link.

Thanks & Regards
Nitesh Raghuwanshi