Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7
  1. #1
    New Coder
    Join Date
    Oct 2012
    Location
    Belgium
    Posts
    15
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Lightbulb Perfect Javascript code not working for me?

    Hi!

    I see on another site, he have a cool Youtube Video player. So, i copied his javascript code and the div tags.
    But these are not working for me ? It shows on the page, the video player, the css etc.. but the play button, animation... are not working

    Javascript code

    Code:
    $(document).ready(function () {
        $('#header').slideDown(500);
        // fade in content.
        $('#whole').fadeIn(1500);
        $("#image").toggle("blind", 800);
        $("#videoto").toggle("blind", 800);
    });
    $(document).ready(function () {
        var specify_videoLength = 270, // specify video length in seconds
            specify_videoID = 'YOUTUBE VIDEO ID', // specify video ID from youtube url
            specify_coverPath = '', // you can specify your folders like img/youtube-image.jpg
    
            // Do not remove anything below this line, unless you know what are you doing!
    
            videoLength = specify_videoLength * 1000,
            videoID = specify_videoID + '?wmode=opaque&autoplay=1&controls=0&disablekb=1&rel=0&showinfo=0';
    
    
        $('.play_button').hover(function () {
            $('.video_overlay').stop().fadeIn(300);
            $('.video_cover').addClass('video_blur');
        }, function () {
            $('.video_overlay').stop().fadeOut(150);
            $('.video_cover').removeClass('video_blur');
        });
    
        $('.play_button').click(function () {
            $('.video_frame').fadeIn('1000');
            $('iframe#YouTube').attr('src', 'http://www.youtube.com/embed/' + videoID);
    
            $('.play_button, .video_cover').fadeOut('1000');
            setTimeout(function () {
                $('.play_button, .video_cover').fadeIn('2000');
            }, videoLength);
        });
    });
    div tags

    Code:
    				<div id="videoto" style="display: block;">
    				<div class="video_wrap">
    					<div class="video_cover"></div>
    
    					<div class="video_overlay" style="display: none; opacity: 1;"><span>Watch The movie</span></div>
    					
    					<div class="play_button">
    						<div class="inner_arrow"></div>
    					</div>
    
    					<div style="display:none" class="video_frame">
    						<div class="video_block"></div>
    							<iframe width="665" height="340" style="border: 0" id="YouTube"></iframe>
    					</div>
    				</div>
    				
    				</

    Someone can help my?

  • #2
    Senior Coder
    Join Date
    Jan 2011
    Location
    Missouri
    Posts
    4,175
    Thanks
    23
    Thanked 601 Times in 600 Posts
    Did you load jquery?
    Evolution - The non-random survival of random variants.

    "If you leave hydrogen alone, for long enough, it begins to think about itself."

  • #3
    New Coder
    Join Date
    Oct 2012
    Location
    Belgium
    Posts
    15
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Yes, i tried it with this versions in one head tags like the demo website:

    Code:
    <script type="text/javascript" src="js/jquery-1.8.0.min.js"></script> 
    
    <script type="text/javascript" src="js/jquery-ui-1.8.23.custom.min.js"></script> 
    
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
    
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
    
      <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

  • #4
    New Coder
    Join Date
    Nov 2013
    Location
    UK
    Posts
    42
    Thanks
    6
    Thanked 1 Time in 1 Post
    Hi
    Where are all the classes declared ? Is there a css ?

  • #5
    New Coder
    Join Date
    Oct 2012
    Location
    Belgium
    Posts
    15
    Thanks
    3
    Thanked 0 Times in 0 Posts
    The css is fine, there are not problems there. This is the class what you need for this

  • #6
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    2,969
    Thanks
    56
    Thanked 557 Times in 554 Posts
    This:
    Code:
    <script type="text/javascript" src="js/jquery-1.8.0.min.js"></script>
    This:
    Code:
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
    And this:
    Code:
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
    Are all different versions of the same script. You should choose one. The same I believe goes for this:
    Code:
    <script type="text/javascript" src="js/jquery-ui-1.8.23.custom.min.js"></script>
    And this:
    Code:
    <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
    although that custom parameter makes me wonder.

    Any script source starting without the http assumes that you have that script saved into the same folder as the page that is calling it (not strictly true, but that's the cut down version and good enough for this case).

    I don't know if that will help, but fixing those things won't hurt.

  • #7
    New Coder
    Join Date
    Oct 2012
    Location
    Belgium
    Posts
    15
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Not working that, i tried everything...
    But, ok i don't need that video player more, i do it now only with simple youtube frame


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •