I need a little help. I went div crazy on my site using a toggle class to hide and the divs in the middle of the page. Well a couple things first the website http://gregedisonproductions.com
The first is if you click on things eventually especially on the leftsidebar they don't switch, and a bigger problem is if I'm watching a video from the leftsidebar and a play another one, it switch's but the audio keeps playing.
I was thinking that if the user clicked on anything, it would refresh the page, then execute the href command.
Can anyone help me in this area?
If you want to reload the page with href, you can try this
Reload
Your problem though involves the fact that when you click on another video, it doesn't stop the original one; it simply hides it. Youtube has an API that allows you to stop the video through javascript though. I believe to pause a video you can do a pauseVideo with the API.
If you want to redirect the URL, just add this to your onclick event, using PHP:
header("Location: http://yourpage.com/"); // add your URL
exit;
Using Javascrip:
window.parent.location = "http://yourpage.com/";
Related
I am working with selenium for the first time, and I'm trying to play a video on another website.
I've already managed to play the video, but now I'm stuck trying to make it full-screen. The full-screen button is hidden unless I hover with my mouse over it.
So I searched for a solution and everybody suggests to use switch_to.frame() and then access the button, but it seems like no frame surrounds the video in my case. I'm not an expert in HTML so maybe I am getting this wrong, but is there a way to click that full-screen button when there's no frame surrounding the video?
Thanks in advance for any help :)
If there isn't an iframe containing the video, you should be able to click the button like you would any other on the screen. To get the hover menu to appear you can use ActionChains(driver).move_to_element(element).perform().
If you're having issues finding the button, you may also be able to video_player.send_keys("f"). Many players will use that shortcut to switch to fullscreen.
I'm trying to rebuild the audio effects this page has http://resn.co.nz/
When hovering over one of the icons an audio file is played that keeps playing even when the next page is loaded. This feels smooth and has a good UX. I have rebuild it as far as I could, however in my case when I click the icon the audio clip stops … How can I prevent this?
Your problem is that when your page redirects and the new one opens, there is a break while everything is loading. On the example you cited, it is never actually redirecting the page, it is just changing the URL. You know it's not redirecting because of the # in the URL. You can learn more here.
I have created a site where instead of "pages" i have created divs that show/hide on different menu clicks using the code below.
The only issue is the You Tube videos on one of the pages, when the user plays the video they then have to stop it otherwise the video continues to play when visiting other pages.
Is there a way to pause the video when the user leaves the page or to just stop the video outright when clicking on another content.
Here is the code for the page navigation
$('#homePage').show();
$('.nav').click(function () {
$('.page:visible').slideUp('slow'); // or .hide()
$($(this).data('target')).slideDown('slow'); // or.show()
})
Any help is greatly appreciated
Hi this page should help a lot. https://developers.google.com/youtube/iframe_api_reference. You are just going to 'wrap' the video in the youtube Api and use their events and methods already tied to it.
Basically what you will need to do is when the div is closed or a button to x out of the video is clicked you will need to do something like this.
$("#myDiv").click(function () {
player.stopVideo();
});
One thing to note is that if you are going to be hidding the showing the div that contains the Iframe you will need to re-add the player everytime it is shown or you will lose your events that are tied to it. I hope this helps.
I am working on a pop out for videos on a website I am doing some development work for. The idea is to click on a thumbnail of the video and then the video pop's off the page. Like how facebook works with their image viewer. I currently have a div tag with it's CSS display attribute set to hidden and an iframe with no src. When a user clicks on the thumbnail for the video I have JavaScript load the appropriate youtube embed link into iframe by this method:
document.getElementById('iframe-id').src = "http://www.youtube.com/embed/(videoID)";
The video is set to automatically start playing. When a user exits the popped off content the src of the iframe is then set to "" by the same method. It works fine, and the video is no longer in the iframe. The issue is with the back button.
Here is my process leading to my problem:
I click on the thumbnail and the
video pops off and starts playing.
I close the popped off content.
I press the back button.
The video I popped off previously is playing in the background. (The Problem)
Here is what I know of the process that is happening:
The page that is being viewed has two
instances created back to back in the
history of a browser. (ie I press the
back button and I am on the same page
still.. this is also when the video
starts playing in particular
browsers)
When I leave the popped off content
open and press the back button I see
just an empty iframe.
I believe my issue lies in the fact that I am changing the src to the iframe. The process of that seems to be causing the browser to load the page again and create a second instance of the same page in the history (where reloading a page does not). When the back button is pressed the page goes to the previous instance, but depending on the browser the hidden iframe is not always empty and the video is playing.
My question(s):
Can this issue be resolved with
JavaScript?
If it can't what could accomplish the task I am trying with out the issue creating two seperate instances of the same page? I was thinking AJAX might be the solution, but I don't know. I am still a little new to this all.
This can be resolved within javascript.
Additionally, AJAX has nothing to do with the problem you're having. AJAX is a mechanism for moving data around, not manipulating HTML documents.
If you just need to display a video, you don't need to use an iframe to do so. I'd suggest keeping a hidden div somewhere on the page and use that as a container for your video pop-up. When you need to display a video, insert whatever HTML you need to get it working into the div and display it when it's ready.
jsFiddle
I have a DailyMotion video embedded in my page, through an iFrame, within a div. If the user clicks on the video, it starts playing.
Is there a way to use jQuery to simulate the user clicking on the video, so that it will start playing automatically? From what I've read so far you can only use jQuery's click() with events attached with jQuery, which wouldn't work here. Can this be done? Thanks for reading.
EDIT:
Forgot to mention, I know you can add ?autoPlay=1 to the DailyMotion embed url, but I need to do this for several online video sites, some of which don't support autoplay, so I need to figure out if there's another way to do it.
In this case there's no need for jQuery at all, you can just add ?autoPlay=1 to the URL, here's your fiddle updated with the change.
No, you can't fake interaction with a document in an iframe from another domain, jQuery or otherwise. It would be a pretty serious security hole if you could frame a third-party site (eg that the user happened to be logged into) and started operating it on their behalf.