www.webdeveloper.com
Page 1 of 2 12 LastLast
Results 1 to 15 of 26

Thread: Need help

  1. #1
    Join Date
    Mar 2012
    Location
    Belgrade
    Posts
    15

    Need help

    can i put in this line prefix
    Code:
    document.getElementById("youtube").src = vids[num];
    to be something like this ?
    Code:
    document.getElementById("http://www.youtube.com/embed/" + "youtube").src = vids[num];
    thank you in advance ?

  2. #2
    Join Date
    Mar 2012
    Posts
    22
    First: don't write "I need help" like title of the post.
    Use something like the description of the problem.

    Second: explain the problem.
    What does the code should do?
    What do you want do?

    Thanks

  3. #3
    Join Date
    Mar 2012
    Location
    Belgrade
    Posts
    15
    i just want to put http://www.youtube.com/embed/ in front of "youtube_code"

  4. #4
    Join Date
    Mar 2012
    Posts
    202
    Quote Originally Posted by ludaludi View Post
    Code:
    document.getElementById("http://www.youtube.com/embed/" + "youtube").src = vids[num];
    You should go through a basic JavaScript DOM tutorial then lookup references using Google for functions like getElementById, and maybe also html definitions for things like "elements". An element is an HTML tag on a webpage that allows for more HTML. Basically like an HTML code seperator or even object like a textbox or button. A URL like "http://www.whatever.com/page" is NOT an element. It is a reference to a new page. Please provide more code along with a description of what you need to accomplish.

  5. #5
    Join Date
    Mar 2012
    Location
    Belgrade
    Posts
    15
    i find this code on this site ...
    Code:
    <script type="text/javascript">
    function rand ( n )
    {
      return ( Math.floor ( Math.random ( ) * n + 1 ) );
    }
    
    var vids = new Array ( );
    vids[0] = "http://www.youtube.com/embed/aF4M0JtoIPk"; ">>>>SONG NAME<<<<"
    vids[1] = "http://www.youtube.com/embed/KMxWhovYfzc"; ">>>>SONG NAME<<<<"
    
    function pick_vid ( )
    {
      var numberOfImages = 2;
      var num = rand(numberOfImages)-1;
      
      document.getElementById("random_youtube_vid").src = vids[num];
      document.getElementById("LINK").innerHTML = vids[num];
    }
    </script>
    
    <script type="text/javascript">window.onload=pick_vid;</script>
    <iframe id="random_youtube_vid" width="250" height="200" frameborder="0" allowfullscreen></iframe>
    
    <div id="LINK"></div>


    so i just want to add some function "SONG NAME" in line
    Code:
    <div id="LINK"></div>
    instead of showing url from youtube video

  6. #6
    Join Date
    May 2006
    Location
    Somewhere behind your screen
    Posts
    1,633
    Code:
    ...
    var vids=[
    ["http://www.youtube.com/embed/aF4M0JtoIPk", ">>>>SONG NAME 1<<<<"],
    ["http://www.youtube.com/embed/KMxWhovYfzc", ">>>>SONG NAME 2<<<<"]
    ];
    
    function pick_vid ( )
    {
      var numberOfImages = 2;
      var num = rand(numberOfImages)-1;
      
      document.getElementById("random_youtube_vid").src = vids[num][0];
      document.getElementById("LINK").innerHTML = vids[num][1];
    }
    ...
    Last edited by Padonak; 03-31-2012 at 01:00 PM. Reason: typo
    xxx: Guess Buddhist riddle: "What is the sound of one hand clapping?"
    yyy: facepalm

  7. #7
    Join Date
    Mar 2012
    Location
    Belgrade
    Posts
    15
    ty so much , so pro !!!!
    i have one more question to ask about this code ?
    Code:
    var vids=[
    ["aF4M0JtoIPk", ">>>>SONG NAME 1<<<<"],
    ["KMxWhovYfzc", ">>>>SONG NAME 2<<<<"]
    ];

    can i remove this part from script "http://www.youtube.com/embed/" and put it in iframe ?
    for exemple <iframe id="http://www.youtube.com/embed/"+"random_youtube_vid"></iframe> or something like that ?
    Last edited by ludaludi; 03-31-2012 at 05:03 PM.

  8. #8
    Join Date
    May 2006
    Location
    Somewhere behind your screen
    Posts
    1,633
    Code:
    ...
    var vids=[
    ["aF4M0JtoIPk", ">>>>SONG NAME 1<<<<"],
    ["KMxWhovYfzc", ">>>>SONG NAME 2<<<<"]
    ];
    
    function pick_vid ( )
    {
      var numberOfImages = 2;
      var num = rand(numberOfImages)-1;
      var prefix = "http://www.youtube.com/embed/";
    
      document.getElementById("random_youtube_vid").src = prefix+vids[num][0];
      document.getElementById("LINK").innerHTML = vids[num][1];
    }
    ...
    xxx: Guess Buddhist riddle: "What is the sound of one hand clapping?"
    yyy: facepalm

  9. #9
    Join Date
    Mar 2012
    Location
    Belgrade
    Posts
    15
    that was fast ... thank you so much , this will help me better understand jquery scripting !!!!

    and i just add suffix xD for auto play ....

    Code:
      var numberOfImages = 2;
      var num = rand(numberOfImages)-1;
    
      var prefix = "http://www.youtube.com/embed/";  
      var suffix = "?rel=0&am;autoplay=1";
    
      document.getElementById("random_youtube_vid").src = prefix+vids[num][0]+suffix;
      document.getElementById("LINK").innerHTML = vids[num][1];
    Last edited by ludaludi; 03-31-2012 at 05:16 PM.

  10. #10
    Join Date
    May 2006
    Location
    Somewhere behind your screen
    Posts
    1,633
    good to hear ))
    xxx: Guess Buddhist riddle: "What is the sound of one hand clapping?"
    yyy: facepalm

  11. #11
    Join Date
    Mar 2012
    Location
    Belgrade
    Posts
    15
    is there any chance to add this code next button ?
    current song + 1 = next song ... something like that
    and when number is over max go back to first song
    Last edited by ludaludi; 04-01-2012 at 05:31 AM.

  12. #12
    Join Date
    May 2006
    Location
    Somewhere behind your screen
    Posts
    1,633
    Code:
    <!DOCTYPE html>
    <html>
    <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title>123</title>
    <head>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
    <style type="text/css">
    body{text-align:center;font-family:Verdana,Arial;font-size:11px;background-color:#fff;color:#000;padding:0px;margin:30px;}
    a:link,a:active,a:visited{color:#000;background-color:transparent;font-weight:bold;letter-spacing:1px;text-decoration:none;}
    a:hover{color:Crimson;background-color:transparent;font-weight:bold;letter-spacing:1px;text-decoration:none;}
    div{margin-top:5px;padding:20px;}
    b{color:Crimson;}
    .cur{color:Green;background-color:transparent;}
    .tot{color:Darkorange;background-color:transparent;}
    </style>
    <script type="text/javascript">
    //we can use this synthax instead of var1=...;var2=...; etc.
    var prefix="http://www.youtube.com/embed/",
    suffix="?rel=0&am;autoplay=1",
    vids=[
    ["aF4M0JtoIPk", "Reborn - Amina Khan"],
    ["KMxWhovYfzc", "New Muslims in Europe"],
    ["1eUOgD2Y9c8", "My Reversion To Islam"],
    ["hp0Wn8BoKyA", "Islam Saved My Life"]
    ];
    function randomNumber(m,n){m=parseInt(m);n=parseInt(n);return Math.floor(Math.random()*(n-m+1))+m;}
    function pick_vid(){
    var num=(typeof(pick_vid.arguments[0])!='undefined')?pick_vid.arguments[0]:randomNumber(0,vids.length-1);
    if(num==vids.length){num=0;}
    /*the above means that you can pass the number of desirable song into the function
    but if no any arguments passed the function picks a random song*/
    $('#youtube_vid').attr('src',prefix+vids[num][0]+suffix);
    $("#descr").html(vids[num][1]);
    var ending='';
    switch(num+1){
    case 1:ending='st';break;
    case 2:ending='nd';break;
    case 3:ending='d';break;
    default:ending='th';
    }
    $('#counter').html('<b class="cur">'+(num+1)+'-'+ending+'</b> of <b class="tot">'+vids.length+'</b> videos is being played now<br /><br /><a href="#null" onclick="pick_vid('+(num+1)+')">play next</a>');
    }
    $(document).ready(function(){
    //just for fun
    var h2=function(){$('h2:has(b:contains("JQuery"))').fadeOut('slow',function(){$(this).remove();});}
    setTimeout(h2,1000);
    });
    </script>
    </head>
    <body>
    <center>
    <iframe id="youtube_vid" width="250" height="200" frameborder="0" allowfullscreen></iframe>
    <div id="descr">song name goes here</div>
    <div id="counter"><h2>Ok let's use <b>JQuery</b> as we went so far ;-)</h2></div>
    <div><a href="#null" onclick="pick_vid()">random song</a></div>
    </center>
    </body>
    </html>
    xxx: Guess Buddhist riddle: "What is the sound of one hand clapping?"
    yyy: facepalm

  13. #13
    Join Date
    Mar 2012
    Location
    Belgrade
    Posts
    15

    we know too much...we went so far
    this is my last question in this topic ... ty so much ... you give me good player script for my forum its so cool
    when user load this script, can random song start autoplay without clicking on random button ?
    Last edited by ludaludi; 04-01-2012 at 11:27 AM.

  14. #14
    Join Date
    May 2006
    Location
    Somewhere behind your screen
    Posts
    1,633
    just replace
    Code:
    $(document).ready(function(){
    //just for fun
    var h2=function(){$('h2:has(b:contains("JQuery"))').fadeOut('slow',function(){$(this).remove();});}
    setTimeout(h2,1000);
    });
    with
    Code:
    $(document).ready(function(){
    pick_vid();
    });
    and of course remove that h2 tag from the markup - it was just for fun
    xxx: Guess Buddhist riddle: "What is the sound of one hand clapping?"
    yyy: facepalm

  15. #15
    Join Date
    Mar 2012
    Location
    Belgrade
    Posts
    15
    i made previous song buttun
    works good too

    Code:
    <script type="text/javascript">
    var prefix="http://www.youtube.com/embed/", suffix="?rel=0&am;autoplay=1"; //we can use this synthax instead of var1=...;var2=...; etc.
    
    vids=[
    ["aF4M0JtoIPk", "Reborn - Amina Khan"],
    ["KMxWhovYfzc", "New Muslims in Europe"],
    ["1eUOgD2Y9c8", "My Reversion To Islam"],
    ["hp0Wn8BoKyA", "Islam Saved My Life"]
    ];
    
    function randomNumber(m,n){
    m=parseInt(m);n=parseInt(n);return Math.floor(Math.random()*(n-m+1))+m;
    }
    
    function pick_vid(){
    var num=(typeof(pick_vid.arguments[0])!='undefined')?pick_vid.arguments[0]:randomNumber(0,vids.length-1);
    if(num==vids.length){num=0;} 
    if (num==-1){num+=vids.length;}
    
    
    $('#youtube_vid').attr('src',prefix+vids[num][0]+suffix);
    $("#descr").html(vids[num][1]);
    var ending=' ';
    switch(num+1){
    case 1:ending='st';break;
    case 2:ending='nd';break;
    case 3:ending='d';break;
    default:ending='th';
    }
    $('#counter').html('<b class="cur">'+(num+1)+'-'+ending+'</b> of <b class="tot">'+vids.length+'</b> videos is being played now<br /><a href="#null" onclick="pick_vid('+(num+1)+')">NEXT SONG</a><a href="#null" onclick="pick_vid('+(num-1)+')">PREV SONG</a>');
    }
    
    $(document).ready(function(){pick_vid();}); //autoplay random start
    </script>
    
    <iframe id="youtube_vid" width="250" height="200" frameborder="0" allowfullscreen></iframe>
    <div id="descr">SONG TITLE</div><div id="counter"></div><div><a href="#null" onclick="pick_vid()">RANDOM SONG</a></div>
    Last edited by ludaludi; 04-01-2012 at 05:17 PM.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles