Random Images - Photo Album

DOWNLOAD SOURCE
.pic {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-color: #EEEEEE;
    border-image: none;
    border-style: solid;
    border-width: 5px 5px 18px;
    box-shadow: 2px 2px 3px #333333;
    position: absolute;
   background-color: #EEEEEE;
}
#imagecontainer{
    width:100%;
    height:400px;
}
</style>
<script>
    function randomFromInterval(from,to)
    {
        return Math.floor(Math.random()*(to-from+1)+from);
    }
function jsonFlickrApi(rsp) {
      var s = "";
      // http://farm{id}.static.flickr.com/{server-id}/{id}_{secret}_[mstb].jpg
      // http://www.flickr.com/photos/{user-id}/{photo-id}
      //s = "total number is: " + rsp.photos.photo.length + "<br/>";

      for (var i=0; i < rsp.photos.photo.length; i++) {
        //var rand = randomFromInterval(1,10);
        var stage_width=800;
        var stage_height=400;
        var left = randomFromInterval(0,stage_width);
 var top = randomFromInterval(0,400);
 var rot = randomFromInterval(-40,40);
 
  if(top>(stage_height-130) && left > (stage_width-230))
  {
   top-=120+130;
   left-=230;
  }
       
        photo = rsp.photos.photo[i];
      var _url = "http://farm" + photo.farm + ".static.flickr.com/" + photo.server + "/" + photo.id + "_" + photo.secret + "_" + "m.jpg";
        p_url = "http://www.flickr.com/photos/" + photo.owner + "/" + photo.id;
        s +=  '<div class="pic" style="top:'+top+'px;left:'+left+'px; -moz-transform:rotate('+rot+'deg); -webkit-transform:rotate('+rot+'deg);">'+
'<img src="' + _url + '"/></div>';
      }
      $('#imagecontainer').append(s);
  }
$(document).ready(function() {

 });

</script>

<div id="imagecontainer">
</div>


<script src="http://api.flickr.com/services/rest/?method=flickr.photos.search&amp;api_key=f3c5222d18401ab6991a5532da0208b1&amp;tags=nature&amp;per_page=50&amp;format=json"></script>

Read More

Departures S01E11 Sri Lanka full video

Read More

How To Configure XDebug - NetBeans

Modify these lines at the end of the .ini file:

Read More

@keyframe

.animate-get-angry
{
  width:100px;
  height:100px;
  background:red;
  position:relative;
  animation:get-angry 5s linear 2s infinite alternate;;
  -moz-animation:get-angry 5s linear 2s infinite alternate;; /* Firefox */
  -webkit-animation:get-angry 5s linear 2s infinite alternate;; /* Safari and Chrome */
  -o-animation:get-angry 5s linear 2s infinite alternate;; /* Opera */
}
@keyframes get-angry
{
0%   {background:red; left:0px; top:0px;}
25%  {background:yellow; left:200px; top:0px;}
50%  {background:blue; left:200px; top:200px;}
75%  {background:green; left:0px; top:200px;}
100% {background:red; left:0px; top:0px;}
}

@-moz-keyframes get-angry/* Firefox */
{
0%   {background:red; left:0px; top:0px;}
25%  {background:yellow; left:200px; top:0px;}
50%  {background:blue; left:200px; top:200px;}
75%  {background:green; left:0px; top:200px;}
100% {background:red; left:0px; top:0px;}
}

@-webkit-keyframes get-angry/* Safari and Chrome */
{
0%   {background:red; left:0px; top:0px;}
25%  {background:yellow; left:200px; top:0px;}
50%  {background:blue; left:200px; top:200px;}
75%  {background:green; left:0px; top:200px;}
100% {background:red; left:0px; top:0px;}
}

@-o-keyframes get-angry/* Opera */
{
0%   {background:red; left:0px; top:0px;}
25%  {background:yellow; left:200px; top:0px;}
50%  {background:blue; left:200px; top:200px;}
75%  {background:green; left:0px; top:200px;}
100% {background:red; left:0px; top:0px;}
}

Read More

Html5 Transform : Translate,Scale,Rotate & Transition

#pic {
  transition:all 2s;
}
#pic:hover
{
  /*General*/
  transform: translate(50%, 50%) scale(2, 2) rotate(10deg);
  /*Firefox*/
  -moz-transform: translate(50%, 50%) scale(2, 2) rotate(10deg);
  /*Microsoft Internet Explorer*/
  -ms-transform: translate(50%, 50%) scale(2, 2) rotate(10deg);
  /*Chrome, Safari*/
  -webkit-transform: translate(50%, 50%) scale(2, 2) rotate(10deg);
  /*Opera*/
  -o-transform: translate(50%, 50%) scale(2, 2) rotate(10deg);
}

A cheeky macaque, Lower Kintaganban River, Borneo. Original by Richard Clark

Read More

html5 Figure & Figcaption

  
  
this is the figure caption 

A cheeky macaque, Lower Kintaganban River, Borneo. Original by Richard Clark

Read More

Flexbox

.flex
   {
      /* basic styling */
      width: 350px;
      height: 200px;
      border: 1px solid #555;
      font: 14px Arial;
 
      /* flexbox setup */
      display: -webkit-flex;
      -webkit-flex-direction: row;
 
      display: flex;
      flex-direction: row;
   }
 
   .flex > div
   {
      -webkit-flex: 1 1 auto;
      flex: 1 1 auto;
 
      width: 30px; /* To make the transition work nicely.  (Transitions to/from
                      "width:auto" are buggy in Gecko and Webkit, at least.
                      See http://bugzil.la/731886 for more info.) */
 
      -webkit-transition: width 0.7s ease-out;
      transition: width 0.7s ease-out;
   }
 
   /* colors */
   .flex > div:nth-child(1){ background : #009246; }
   .flex > div:nth-child(2){ background : #F1F2F1; }
   .flex > div:nth-child(3){ background : #CE2B37; }
 
   .flex > div:hover
   {
        width: 200px;
   }

uno

due

tre

Read More

SVG Scalable Vector Graphics

Scalable Vector Graphics (SVG) is a family of specifications of an XML-based file format for two-dimensional vector graphics, both static and dynamic (i.e., interactive or animated). The SVG specification is an open standard that has been under development by the World Wide Web Consortium (W3C) since 1999. SVG images and their behaviors are defined in XML text files. This means that they can be searched, indexed, scripted, and, if need be, compressed. As XML files, SVG images can be created and edited with any text editor, but it is often more convenient to create them with drawing programs such as Inkscape. All major modern web browsers—including Mozilla Firefox, Internet Explorer 9 and 10, Google Chrome, Opera, and Safari—have at least some degree of support for SVG and can render the markup directly. Earlier versions of Microsoft Internet Explorer (IE) do not support SVG natively. from Wikipedia

Read More

css3 columns

.two-columns
{
  -moz-column-count: 2;
  -moz-column-gap: 20px;
  -webkit-column-count: 2;
  -webkit-column-gap: 20px;
  column-count: 2;
  column-gap: 20px;
}

Animation is the rapid display of a sequence of images to create an illusion of movement.
a camera and a projector or a computer viewing screen which can rapidly cycle through images in a sequence.

Read More

70-573 TS Microsoft SharePoint 2010, Application Development c#

Source	Size	DownLoad	Date
Microsoft.CertifyMe.70-573.v2011-10-04.by.bennus.157q.vce	337KB	Download .vce file	03/04/2012
Microsoft.CertifyMe.70-573.v2012-03-14.by.kemron.172q.vce	377KB	Download .vce file	03/04/2012
Microsoft.PrepKing.70-573.v2011-09-26.by.Al.150q.vce	326KB	Download .vce file	03/04/2012
Microsoft.TestKing.70-573.v2010-11-02.by.TomCat.150q.vce	356KB	Download .vce file	03/04/2012

Read More