Learn 2 Programming: July 2013

Sunday 28 July 2013

Browse file code

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>

<script >
    function imageURL(input) {
        if (input.files && input.files[0]) {
            var reader = new FileReader();
            reader.onload = function(e) {
                $('#preview_img').attr('src', e.target.result)
                 var max_size = 500;
 $("#preview_img").each(function(i) {
 if ($(this).height() > $(this).width()) {
 var h = max_size;
 var w = Math.ceil($(this).width() / $(this).height() * max_size);
 } else {
 var w = max_size;
 var h = Math.ceil($(this).height() / $(this).width() * max_size);
 }
 $(this).css({ height: h, width: w });
 });
             }
             reader.readAsDataURL(input.files[0]);
         }
    }
</script>
</head>

 
<body>
<form>
  <p>
  <input type="file" name="data[Settings][pic]" size="42" onchange="imageURL(this)" id="SettingsPic">
  <br/><br/><br>
  <img id="preview_img" />
  </p>

</form>
</body>
</html>

learn 2 programming-How To Make Image SlideShow

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<HTML>
  <HEAD>
    <TITLE>learn 2 programming</TITLE>
    <STYLE type="text/css">
      UL { 
        background: yellow; 
        margin: 12px 12px 12px 12px;
        padding: 3px 3px 3px 3px;
                                     /* No borders set */
      }
      LI { 
        color: white;                /* text color is white */ 
        background: blue;            /* Content, padding will be blue */
        margin: 12px 12px 12px 12px;
        padding: 12px 0px 12px 12px; /* Note 0px padding right */
        list-style: none             /* no glyphs before a list item */
                                     /* No borders set */
      }
      LI.withborder {
        border-style: dashed;
        border-width: medium;        /* sets border width on all sides */
        border-color: lime;
      }
body {background-attachment: fixed;
  background-image: url("yp.jpg");
  background-repeat: no-repeat;
} 
</div><div class='widget Gadget' id='Gadget2'>
<h2 class='title'>Fish</h2>
<div class='widget-content'>
<script type="text/javascript">
        if (!window.gadgets || !gadgets.rpc) {
          document.write('<script type="text/javascript"' +
    'src="//www-blogger-opensocial.googleusercontent.com/gadgets/js/rpc.js?container\x3dblogger\x26nocache\x3d0\x26debug\x3d0\x26c\x3d1\x26v\x3d0a1224b6979b7ff15d042e87442b8e08\x26sv\x3d7">' +
                  '</scr' + 'ipt>');
        }
      </script>

    </STYLE>
  </HEAD>

<!-- Image Slide Show Start website image -->
<script type="text/javascript" src="http://www.2createawebsites.com/resources/howtocreateawebsitefadeslide.js"></script>   
<script type="text/javascript">  
var mygallery=new fadeSlideShow({   
 wrapperid: "fadeshow2", //ID of blank DIV on page to house Slideshow   
 dimensions: [600, 400], //width/height of gallery in pixels. Should reflect dimensions of largest image
      imagearray:  [

 //change this url with your image url

["http://www.2createawebsites.com/resources/slide-show-how-2-create-a-website-image-1.jpg"],    
      ["http://www.2createawebsites.com/resources/slide-show-how-2-create-a-website-image-2.jpg"], 
      ["http://www.2createawebsites.com/resources/slide-show-how-2-create-a-website-image-3.jpg"],
      ["http://www.2createawebsites.com/resources/slide-show-how-2-create-a-website-image-4.jpg"],
      ["http://www.2createawebsites.com/resources/slide-show-how-2-create-a-website-image-5.jpg"]// <--no trailing comma after very last image element!   
      ],

 displaymode: {type:'auto', pause:1000, cycles:0, wraparound:false},   
  persist: false, //remember last viewed slide and recall within same session?   
  fadeduration: 2000, //transition duration (milliseconds)  
  descreveal: "ondemand",
  togglerid: ""
  })
 </script><div id="fadeshow2">   
 </div>
<!-- Image Slide Show End -->


</HTML>

------------------------------------------X-----------------------------------------

//save as index.html

Search Google

Sunday 28 July 2013

Browse file code

learn 2 programming-How To Make Image SlideShow