I'm trying to make a web page formatted similar to that of Netflix. Where a list of videos are displayed in a div with two arrows in either direction on each side. When the number of videos are more than the width of the window clicking the arrows moves the displayed videos in the corresponding direction by one video.
And(key part), when a video is clicked, the clicked video gets displayed on another div(main part of the screen) with a text of introduction and an excerpt of the video playing in the background of that section, plus a "play" button to start the video.
I would probably be able to sort it out with vanilla code. But this page is managed by WordPress so I would have to plug in my code with wordpress.
My assumption is that hacking the existing elementor code for the video widget would be the quickest way to do it. But I don't know how to find the code corresponding to the functionality I need to modify to customize it to do what I want. I can locate the video-widget file, but still, it's a huge file with lots of code. How do I find the functionality I need specifically to import into my own code?
Thank you and sorry for the verbose phrasing.
Related
my question is really simple and I still didn't find the answer, maybe because I misspoke about it or didn't use the right keywords, anyways here is the topic:
I have an SVG script that contains some animation (like Bezier curves), I want to put it online, so I get back a link and whenever a user clicks on it, it's going to display my SVG file on the browser.
Is it possible?
I have a floating action button and when the users taps on it I want a layout to be shown, animating from the bottom exactly like the Google Drive app (so not covering the whole screen).
I read someone suggest the open source Umano's AndroidSlidingUpPanel but that is more similar to the Google Play Music app and I don't want that as I don't need the panel to be draggable/slidable.
What component should I use?
This is the Bottom sheet component. Check out its specs:
http://www.google.com/design/spec/components/bottom-sheets.html#bottom-sheets-specs
There are third libraries for the bottom sheet if you don't want to make it your self.
I am using the nivo lightbox in my theme I have added a youtube video link , when user clicks on button video starts to play. But it is not playing on full screen. How can I make the video play full screen on nevo lightbox? thanks
I noticed that nobody gives an answer to this question anywhere and I needed it too. Vimeo goes fine but Youtube specically needs the iframe's allowfullscreen="true", so I looked into the code of jquery.nivo.js (and/or jquery.nivo.min.js if you use it). search for "$('<iframe>', and add the option allowfullscreen: true,
Do this search twice and repeat this addition a second time further down. allowfullscreen: 'true', gives the same result, no problem. Whether a boolean (true) or a string ('true') doesn't matter. jquery picks up the additional option flauwlessly and youtube videos will show their fullscreen button nicely. It was probably forgotten by the makers of the nivo lightbox. To add it in the min.js I simply broke the single line in two parts, search for the var and added the option without spaces, after which I concatenated the two parts back again. Works flawlessly. I've used the boolean method but have no special reasons. It may be a fraction faster than the string.
So this is going to be kinda silly, but I don't like the arrows for Magnific Popup, and I want to use some png arrows that I created, even moreso I don't want them the default way where they are miles apart, and I don't want them to obstruct content (cause I am using Magnific Popup to gallery some ajax). I really want them bound in div/big square buttons on the side of the image (the height of the image as well) like the first example here:
and those big black bars on a tv
I have no idea where the code is to change this, or how to edit the basic construction of the lightbox but I really want to change the arrows (and the x) if someone could direct me to the code where I can do this I will be glad to do it but I feel like I am working blind.
Alternatively, if anyone knows any other lightboxes that allow you to position and design your own arrows and close button, and have a gallery of ajax based items (that is responsive and scrolls) I will gladly switch (I basically want to be behance ha ha)
(also is there anyway we can generate a swipe effect to go through a gallery?)
Feel free to tell me to go to hell if it is impossible :D
Thanks.
I'm currently working on a flash project, which will use multiple scroll areas.
I'm trying to find out how to create a scroll area like I see on stackoverflow, and make it function similarly.
Whenever someone posts their lines of code to stackoverflow, the scroll area scrollbar looks exactly like the scrollbar in the web browser, and is able to be scrolled with the mousewheel smoothly, without affecting the webpage scrolling.
Example: disable mouse wheel scrolling while cursor over flex app?
Could anyone please explain to me how I can do this in my flash project?
Thanks!!
You wouldn't need flash to do this... This is accomplished using CSS. You would just need to put the portion you wanted to function like that in a div (or any HTML container for that matter) and then define such properties as min-height, max-height, min-width, max-width, overflow, etc. I think there's one that determines the presence of the scroll bars but I don't remember what it is for sure. Very easy to do this and flash would be a bit of overkill.