Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/themes/smoothness/jquery-ui.min.css" rel="stylesheet" type="text/css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<meta charset=utf-8 />
  
<title>TV Online</title>
</head>
<body>
  <div class="channels">
    <ul>
      <div id="shadow"></div>        </ul>
    <div class="container"></div>
  </div>
  
  <div style="display:none;" class="item">
    <span class="linkurl" data-channel-url="{{URL}}">
      <img class="imagelink" src="{{IMG}}" alt="">
      <h2 class="title">
        {{TITLE}}
      </h2>
    </span>
  </div>
  
</body>
</html>
 
$(document).ready(function(){
  
  $(".linkurl").click(function(){
    console.log('click-click');
  });
  var url = "http://pipes.yahoo.com/pipes/pipe.run?_id=bb1d5ce1d18dab1a143e5d691ea53061&_render=json";
  $.ajax({
    url: url,
    dataType: 'json'
  })
  .done(function(data) {
    items = data.value.items;
    //   console.log(items)
    count = items.count;
    var k=0;
    for (k in items){
      title = items[k].title;
      url   = items[k].url;
      image = items[k].image;
      //     console.log(image);
      
      var item = $("div.item")
      .clone().html()
      .replace("{{IMG}}", image)
      .replace("{{TITLE}}", title)
      .replace("{{URL}}", url);
      
      $("div.channels ul")
      .append($('<li>')
              .append($(item)))
      .show();
    }
  });
});
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
arudminpro
0viewers