I aim to creator.

1. jQuery
2. jQuery Masonry

$(function(){
  $('#main_container').masonry({
     itemSelector: '.box',
     isFitWidth: true,
     isAnimated: true
  });
});

    
        

            


Box1



Box2



Box3



Box4



Box5



Box6



Box7



Box8



Box9

            body{ background-color: #808080; }
            #main_container{ margin: 0 auto; width: 900px; }
            .box{
                background-color: #fff;
                float: left;
                width: 200px;
                margin: 10px;
                padding: 10px;
                border-radius: 5px;
            }

1. JavaScript内で使用されるほほう数を加算
2. PHPにPOSTでページURLと"Increment"を送信
3. ほほうボタンスタイル変更

1. JavaScript内で使用されるほほう数をデクリメント
2. PHPにPOSTでページURLと"Decrement"を送信
3. ほほうボタンスタイル変更

http://izumikawa.tk/api/hohoubotan/phpint.php?data=PageURL

http://izumikawa.tk/api/hohoubotan/hohou_botan_share.php

var xmlHttp; 
var phpint; 
var eventlog = 'null'; 
var pageurl = location.href; 
xmlHttp = new XMLHttpRequest(); 
xmlHttp.onreadystatechange = loading; 
xmlHttp.open("GET", "http://izumikawa.tk/api/hohoubotan/phpint.php?data="+pageurl, false); 
xmlHttp.send(null); 
function loading() {
     window.addEventListener('load', function () { 
     console.log("loading: ", xmlHttp.readyState, xmlHttp.status); 
     phpint = xmlHttp.responseText; 
     if (xmlHttp.readyState == 4 && xmlHttp.status == 200) { 
        var hohou_botanobject = document.getElementById("hohou_botan"); 
        hohou_botanobject.innerHTML = 'ほほう' + phpint; 
        hohou_botanobject.style.borderRadius = "5px"; 
        hohou_botanobject.style.MozBorderRadius = "5px"; 
        hohou_botanobject.style.WebkitBorderRadius = "5px"; 
        hohou_botanobject.style.padding = "5px"; 
        hohou_botanobject.style.color = "#FF3E3E"; 
        hohou_botanobject.style.textAlign = "center"; 
        hohou_botanobject.style.fontWeight = "bold"; 
        hohou_botanobject.style.backgroundColor = '#FFFFFF'; 
        hohou_botanobject.style.cursor = "pointer"; 
    } 
  }, false); 
} function hohou_share() { 
    if(eventlog == 'null') { 
        eventlog = 'value'; 
        phpint++; 
        var data = { main_data: 'Increment', data_url: pageurl }; 
        var http_post = new XMLHttpRequest(); 
        http_post.onreadystatechange = function () { 
            var READYSTATE_COMPLETED = 4; 
            var HTTP_STATUS_OK = 200; 
            if (this.readyState == READYSTATE_COMPLETED && this.status == HTTP_STATUS_OK) { 
                var hohou_object = document.getElementById('hohou_botan'); 
                hohou_object.innerHTML = 'ほほう' + phpint; 
                hohou_object.style.backgroundColor = '#FF3C3C'; 
                hohou_object.style.color = "#FFFFFF"; 
             } 
        }; 
        http_post.open('POST', 'http://izumikawa.tk/api/hohoubotan/hohou_botan_share.php'); 
        http_post.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); 
        http_post.send(form_data(data)); 
    }else if(eventlog == 'value') { 
        eventlog = 'null'; 
        phpint--; 
        var data = { main_data: 'Decrement', data_url: pageurl }; 
        var http_post = new XMLHttpRequest(); 
        http_post.onreadystatechange = function () { 
            var READYSTATE_COMPLETED = 4; 
            var HTTP_STATUS_OK = 200; 
            if (this.readyState == READYSTATE_COMPLETED && this.status == HTTP_STATUS_OK) { 
                var hohou_object = document.getElementById('hohou_botan'); 
                hohou_object.innerHTML = 'ほほう' + phpint; 
                hohou_object.style.backgroundColor = '#FFFFFF'; 
                hohou_object.style.color = "#FF3E3E"; 
             } 
        }; 
        http_post.open('POST', 'http://izumikawa.tk/api/hohoubotan/hohou_botan_share.php'); 
        http_post.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded'); 
        http_post.send(form_data(data)); 
    } 
} 
function form_data(data) { 
    var params = []; 
    for(var name in data) { 
        var value = data[name]; 
        var param = encodeURIComponent(name).replace(/%20/g, '+') + '=' + encodeURIComponent(value).replace(/%20/g, '+'); params.push(param); 
    } return params.join('&'); 
}

1. 投稿を取得
2. プロフィール情報を全て取得
3. Google+POSTを検索
4. Googleログイン
5. Google+投稿

ほほうボタンとは??

1. Internet Explorer9
2. Google Chrome
3. Mozilla Firefox

Internet Explorer

Google Chrome

Mozilla Firefox

<!DOCTYPE html>
<html lang="ja">
    <head>
        <meta charset="utf-8" />
        <title></title>
    </head>
    <body>
        <script>
            window.addEventListener("load", function ()
            {
                var myContext = document.getElementsByTagName("canvas")[0];
                var context = myContext.getContext("2d");
                if (!context) { return; }
 
                context.beginPath();
 
                context.moveTo(50, 50);
                context.lineTo(80, 20);
                context.lineTo(80, 50);
 
                context.strokeStyle = "red";
                context.lineWidth = "2";
                context.stroke();
            }, false);
        </script>
        <canvas id="context" height="1000" width="800">
            Canvas対応ブラウザを使用してください。
        </canvas>
    </body>
</html>

                context.moveTo(50, 50);
                context.lineTo(80, 20);
                context.lineTo(80, 50);
 
                context.strokeStyle = "red";
                context.lineWidth = "2";
                context.stroke();

                context.moveTo(x, y);
                context.lineTo(x, y);

                context.moveTo(3, 3);
                context.lineTo(8, 14);
                context.lineTo(13, 3);

                context.moveTo(3, 3);
                context.lineTo(6, 14);
                context.lineTo(10, 4);
                context.lineTo(13, 14);
                context.lineTo(16, 3);

                context.strokeStyle = "red";
                context.lineWidth = "2";
                context.stroke();

プログラミングとは何なのか?

パソコンの歴史を辿ればプログラミングに深く興味を持つ!

プログラミングをちょっとしてみたい!!

• PHP
• JavaScript
• Java

学習方法

    <?php
        if($i=0; $i <= 10; $i++) {
            print $i;
        }
    ?>

    <?php
        if($i=0; $i <= 10; $i++) {
            print '現在[' . $i . ']回繰り返しました。\r\n';
        }
    ?>