Mobile-Web-App

Friday, June 8, 2012

Load Flickr images and display in horizontal scroll bar, using jQuery

The former "Load Flickr image in JSON format, using jQuery - display in <ul>". In this version, it's modified to display in horizontal scroll bar.

<!DOCTYPE html>
<html>
<head>
  <script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
  <script>
  $(document).ready(function(){    

    $.getJSON(
      "http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?",
      { format: "json"},
        function(data){  
          var number_of_image = 0;
          $.each(data.items, function(i,item){  
            var new_img = $(document.createElement("img")); 
            new_img.attr("src", item.media.m); 
            new_img.css({"width": 150, "height": 150, "margin": 5});    
            $("#flickrimage").append(new_img);
            
            number_of_image++;
            
          }); 

          $("#flickrimage").css({"width": number_of_image * 160});       
        }
      );
      
  
  }) 

  </script>
</head>
<body>
<p>Display Flickr images in horizontal scroll bar</p>
<div style="width:800px; height: 180px; overflow:scroll;">
<div id="flickrimage">
</div>
</div>
</body>
</html>

Wednesday, June 6, 2012

The new, larger version of the Internet: IPv6

google.com/ipv6 -- Vint Cerf, Chief Internet Evangelist at Google, and a founding father of the Internet, discusses the next version of the Internet, IPv6, and why we need it.

When the Internet launched operationally in 1983, no one ever dreamed that there might be billions of devices and users trying to get online. But like a telephone network that is running out of phone numbers, the current Internet is running out of IP addresses, and if we don't roll out Internet Protocol v6 (IPv6), we won't have the room we need to grow and the Internet would become tangled, unsafe and unsustainable.

Tuesday, June 5, 2012

IPv6 is coming to the world

Major Internet service providers (ISPs), home networking equipment manufacturers, and web companies around the world are coming together to permanently enable IPv6 for their products and services by 6 June 2012.

Organized by the Internet Society, and building on the successful one-day World IPv6 Day event held on 8 June 2011, World IPv6 Launch represents a major milestone in the global deployment of IPv6. As the successor to the current Internet Protocol, IPv4, IPv6 is critical to the Internet's continued growth as a platform for innovation and economic development.

~ http://www.worldipv6launch.org/

Monday, June 4, 2012

Facebook open source internal C++ library

Facebook release Folly(Facebook Open-source LibrarY), an open-source C++ library developed and used at Facebook.

~ https://github.com/facebook/folly

Sunday, June 3, 2012

Load Flickr image in JSON format, using jQuery

Example to load Flickr image in JSON format, using jQuery.

<!DOCTYPE html>
<html>
<head>
  <script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
  <script>
  $(document).ready(function(){
  
    var div_flickrimage = document.getElementById("flickrimage");
    var new_ul = $(document.createElement("ul"));
    $(new_ul).appendTo(div_flickrimage);
  
    $.getJSON(
      "http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?",
      { format: "json"},
        function(data){
          $.each(data.items, function(i,item){
          
            var new_li = $(document.createElement("li"));
            $("<img/>").attr("src", item.media.m).appendTo(new_li);
            new_li.appendTo(new_ul);
            
          });          
        }
      );
  })  

  </script>
</head>
<body>
  <div id="flickrimage"></div>

</body>
</html>

Create HTML List using jQuery

Example to create HTML List using jQuery:

<!DOCTYPE HTML>
<html>
<head>
  <meta charset="utf-8"/>
  <title>Mobile-Web-App: Create HTML List using jQuery</title>  
  <script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
         
  <script > 
    $(document).ready(function(){ 
      var div_info = document.getElementById("info");
    
      var new_ul = $(document.createElement("ul"))

      $(create_li("Sunday")).appendTo(new_ul);
      $(create_li("Monday")).appendTo(new_ul);
      $(create_li("Tuesday")).appendTo(new_ul);
      $(create_li("Wednesday")).appendTo(new_ul);
      $(create_li("Thursday")).appendTo(new_ul);
      $(create_li("Friday")).appendTo(new_ul);
      $(create_li("Saturday")).appendTo(new_ul);
      $(new_ul).appendTo(div_info);
    }
  )          

  function create_li(item){  
    var new_li = $(document.createElement("li"));   
    $("<p>" + item + "</p>").appendTo(new_li);    
    return new_li;
  }      

  </script>
  
</head>
<body>
  <H1>Mobile-Web-App: Create HTML List using jQuery</H1> 
  <div id="info">
  </div>
  
</body>
</html>

Related:
- Create HTML List using Javascript

Create HTML List using Javascript

Example to create HTML List using Javascript:

<!DOCTYPE HTML>
<html>
<head>
  <meta charset="utf-8"/>
  <title>Mobile-Web-App: Create HTML List using Javascript</title>
         
  <script > 
    function myOnLoad(){ 
      var div_info = document.getElementById("info");
    
      var new_ul = document.createElement("ul");
      
      new_ul.appendChild(create_li("Sunday"));
      new_ul.appendChild(create_li("Monday"));
      new_ul.appendChild(create_li("Tuesday"));
      new_ul.appendChild(create_li("Wednesday"));
      new_ul.appendChild(create_li("Thursday"));
      new_ul.appendChild(create_li("Friday"));
      new_ul.appendChild(create_li("Saturday"));
      
      div_info.appendChild(new_ul);
    }            
    
  function create_li(item){
    var new_li = document.createElement("li"); 
    new_li.innerHTML = item;
    return new_li;
  }
  
  window.onload = myOnLoad;
  </script>
  
</head>
<body>
  <H1>Mobile-Web-App: Create HTML List using Javascript</H1> 
  <div id="info">
  </div>
  
</body>
</html>

Related:
- Create HTML List using jQuery