Forked from: Yokihito.Oki's forked: ドット絵エディタ改 View Diff (8) forked: ドット絵エディタ改 doppel Follow 2013-05-06 05:17:49 License: MIT License Fork0 Fav0 View1486 Play Stop Reload Fullscreen Smart Phone Readme JavaScript 44 lines HTML 3 lines CSS 11 lines forked: ドット絵エディタ改 jQuery v1.7 // forked from Yokihito.Oki's "forked: ドット絵エディタ改" http://jsdo.it/Yokihito.Oki/21qq // forked from Takaaki.Tanaka's "forked: ドット絵エディタ改" http://jsdo.it/Takaaki.Tanaka/7YqW // forked from naga3's "ドット絵エディタ" http://jsdo.it/naga3/t5KX $(function() { var pals = ['000', '088', '00d', '438', '800', '888', '8cf', 'aa2', 'b82', 'c18', 'fbb', 'e00', 'fd0', 'feb', 'ddd', 'fff']; var pushed = false; var color = ''; var text = 0; var row = '<tr>'; for (i = 0; i < 20; i++) row += '<td> </td>'; row += '</tr>'; for (i = 0; i < 20; i++) $('#canvas').append(row); $('#palette').html(row); for (i = 0; i < 20; i++) $('#palette td').eq(i).css({backgroundColor: '#' + pals[i]}); for (i = 0; i < 20; i++) $('#palette td').eq(i).text(i); $('#canvas td').mousedown(function() { pushed = true; $(this).text(text); $(this).css({backgroundColor: color}); return false; }).mousemove(function() { if (pushed) $(this).text(text); if (pushed) $(this).css({backgroundColor: color}); return false; }); $(document).mouseup(function() { pushed = false; }); $('#palette td').click(function() { $(this) .css({borderColor: 'yellow'}) .siblings() .css({borderColor: 'gray'}); color = $(this).css('background-color'); text = $(this).text(); }).eq(0).click(); }); <table id="canvas"></table> <table id="palette"></table> forked: ドット絵エディタ改 table { border-collapse: collapse; margin-bottom: 20px; } td { border: 1px solid gray; width: 20px; line-height: 20px; cursor: pointer; } // forked from Yokihito.Oki's "forked: ドット絵エディタ改" http://jsdo.it/Yokihito.Oki/21qq // forked from Takaaki.Tanaka's "forked: ドット絵エディタ改" http://jsdo.it/Takaaki.Tanaka/7YqW // forked from naga3's "ドット絵エディタ" http://jsdo.it/naga3/t5KX $(function() { var pals = ['000', '088', '00d', '438', '800', '888', '8cf', 'aa2', 'b82', 'c18', 'fbb', 'e00', 'fd0', 'feb', 'ddd', 'fff']; var pushed = false; var color = ''; var text = 0; var row = '<tr>'; for (i = 0; i < 20; i++) row += '<td> </td>'; row += '</tr>'; for (i = 0; i < 20; i++) $('#canvas').append(row); $('#palette').html(row); for (i = 0; i < 20; i++) $('#palette td').eq(i).css({backgroundColor: '#' + pals[i]}); for (i = 0; i < 20; i++) $('#palette td').eq(i).text(i); $('#canvas td').mousedown(function() { pushed = true; $(this).text(text); $(this).css({backgroundColor: color}); return false; }).mousemove(function() { if (pushed) $(this).text(text); if (pushed) $(this).css({backgroundColor: color}); return false; }); $(document).mouseup(function() { pushed = false; }); $('#palette td').click(function() { $(this) .css({borderColor: 'yellow'}) .siblings() .css({borderColor: 'gray'}); color = $(this).css('background-color'); text = $(this).text(); }).eq(0).click(); }); <table id="canvas"></table> <table id="palette"></table> table { border-collapse: collapse; margin-bottom: 20px; } td { border: 1px solid gray; width: 20px; line-height: 20px; cursor: pointer; } use an iframe compat browser, deer Play on jsdo.it games Author Share ブログに埋め込む QR Tag Download Complete! Description What kind of game? Control Device Smartphone Controllerjsdo.it WebSocket Controller» Mouse Keyboard Touch Device Fullscreen Activated Inactivated jsdo.it games から削除する Submit Author doppel Tweet Default Panel Auto play Screenshot Readme JavaScript HTML CSS Size Width: px Height: px code <script type="text/javascript" src="http://jsdo.it/blogparts/1jEk/js"></script> application dot editor jquery user_interface Discussion Questions on this code? Tags application dot editor jquery user_interface
