1<!doctype html> 2<html lang="ko"> 3<head> 4 <meta charset="UTF-8"> 5 <title>ì´ë¯¸ì§ë§µ ì¶ì¶ê¸°</title> 6 <link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Pacifico|Architects+Daughter|Droid+Sans|Oswald|Poiret+One|Muli|Pacifico" /> 7 <link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/earlyaccess/notosanskr.css" /> 8 <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/css/bootstrap.min.css" /> 9 <link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css" /> 10 <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/intro.js/1.1.1/introjs.min.css" /> 11 <link rel="stylesheet" type="text/css" href="/imageMap/css/imagemap.css" /> 12</head> 13<body> 14<div class="container-fluid"> 15 <div class="row"> 16 <div class="imageCanvas col-xs-8"> 17 <div id="image"> 18 <span class="imageTitle" data-step="3" data-intro="ì°ê²°íë©´ ì´ê³³ì ì´ë¯¸ì§ê° ëíë©ëë¤!"><i class="fa fa-chain-broken fa-4x"></i><br />ì´ë¯¸ì§ë¥¼ ì°ê²°í´ì£¼ì¸ì.</span> 19 </div> 20 </div> 21 <div class="imageControl col-xs-4"> 22 <div class="controlSec"> 23 <header data-step="1" data-intro="ì´ë¯¸ì§ë§µ ìì¹ë¥¼ ë§ë¤ì´ì£¼ë ì¬ì´í¸ì ëë¤."> 24 <h1><span>i</span>mage<span>M</span>ap</h1> 25 <p>HTML <strong>"imageMap"</strong> Algorism Genenater</p> 26 </header> 27 <section class="btnSec"> 28 <a href="https://github.com/dstyle0210/imageMap" class="btn btn-xs btn-info" target="_blank" title="ImageMap GitHub íì´ì§ ë°ë¡ê°ê¸°"><i class="fa fa-github-square fa-2x"></i></a> 29 <a href="https://github.com/dstyle0210/imageMap/tags" class="btn btn-xs btn-info" target="_blank" title="imageMap ë¤ì´ë¡ë íì´ì§ ë°ë¡ê°ê¸°"><i class="fa fa-download fa-2x"></i></a> 30 <button type="button" class="btn btn-xs btn-info" title="ëìë§ ë¤ì보기" data-step="8" data-intro="ë¤ì ë³´ì¤ë ¤ë©´ ëìë§ì í´ë¦í´ì£¼ì¸ì!" id="introStartBtn"><i class="fa fa-question-circle fa-2x"></i></button> 31 </section> 32 <section class="stepSec step1Sec" data-step="2" data-intro="ì´ë¯¸ì§ë§µì 구í ì´ë¯¸ì§ê²½ë¡(URL)ì ë£ê³ 'ì°ê²°í기'를 ë르ì¸ì!"> 33 <h2>1. ì´ë¯¸ì§ê²½ë¡(URL)</h2> 34 <div class="swicthBtn" data-step="5" data-intro="URLë¡ ë¶ë¥´ê±°ë ëë ìì ì PCìì íì¼ì ê°ì ¸ì¬ì ìì´ì."> 35 <div class="btn-group btn-group-xs"> 36 <button type="button" class="btn btn-default active" id="urlInputOpen">URL</button> 37 <button type="button" class="btn btn-default" id="fileInputOpen">Local File</button> 38 </div> 39 </div> 40 <div class="historyBtn" id="historyBtn" data-step="4" data-intro="íë² ì¬ì©íë URLì ì¬ì©ìì PCì ìëì ì¥ëê³ ,ë¶ë¬ì¬ì ìì´ì!(ìµë 5ê°)"><button type="button" class="btn btn-xs btn-default" id="recentLoadBtn" title="기존 URL ë¶ë¬ì¤ê¸°"><i class="fa fa-cloud-download fa-lg"></i> ìµê·¼ URL</button></div> 41 <ul class="history" id="recentHistoryList"></ul> 42 <div class="input-group" id="urlInputForm"> 43 <input type="text" class="form-control" id="url" placeholder="ì´ë¯¸ì§ê²½ë¡" /> 44 <span class="input-group-btn"> 45 <button class="btn btn-info" type="button" id="setupBtn">ì°ê²°í기</button> 46 </span> 47 </div> 48 <div class="input-group hide" id="fileInputForm"> 49 <input type="file" class="form-control" id="file" placeholder="ì´ë¯¸ì§ê²½ë¡" /> 50 <span class="input-group-btn"> 51 <button class="btn btn-info" type="button" id="setupBtn2">ì°ê²°í기</button> 52 </span> 53 </div> 54 </section> 55 <section class="stepSec step2Sec" data-step="6" data-intro="ë¶ë¬ìì§ ì´ë¯¸ì§ì ê°ë¡,ì¸ë¡,ìì´ë('imagemap')ì´ ë¤ì´ìì. , 모ë ìì í ì ìì´ì."> 56 <h2>2. ì´ë¯¸ì§ì ë³´</h2> 57 <div class="row"> 58 <div class="col-xs-4"> 59 <div class="input-group"> 60 <label for="imageWidth" class="input-group-addon">ê°ë¡(px)</label> 61 <input type="text" class="form-control" name="" id="imageWidth" /> 62 </div> 63 </div> 64 <div class="col-xs-4"> 65 <div class="input-group"> 66 <label for="imageHeight" class="input-group-addon">ì¸ë¡(px)</label> 67 <input type="text" class="form-control" name="" id="imageHeight" /> 68 </div> 69 </div> 70 <div class="col-xs-4"> 71 <div class="input-group"> 72 <label for="imageId" class="input-group-addon">ìì´ë(#)</label> 73 <input type="text" class="form-control" name="" id="imageId" /> 74 </div> 75 </div> 76 </div> 77 </section> 78 <section class="stepSec step3Sec"> 79 <h2>3. ì íë ì´ë¯¸ì§ë§µ ì ë³´</h2> 80 <div class="btn-group btn-group-justified" data-step="7" data-intro="ìíë ì½ë ë°©ìì¼ë¡ ë°ì´í°ë¥¼ ê°ì ¸ì¬ì ìì´ì!"> 81 <div class="btn-group" role="group"> 82 <button type="button" class="btn btn-default" id="crwalCoordsBtn">Coords</button> 83 </div> 84 <div class="btn-group" role="group"> 85 <button type="button" class="btn btn-default" id="crwalPxBtn">Position(px)</button> 86 </div> 87 <div class="btn-group" role="group"> 88 <button type="button" class="btn btn-default" id="crwalPerBtn">Position(%)</button> 89 </div> 90 </div> 91 <div class="mapResult"> 92 <div id="usemap"> 93 <h3>Usemap Code</h3> 94 <textarea class="form-control"></textarea> 95 </div> 96 <div id="style"> 97 <h3>CSS</h3> 98 <textarea class="form-control"></textarea> 99 </div> 100 <div id="html"> 101 <h3>HTML</h3> 102 <textarea class="form-control"></textarea> 103 </div> 104 </div> 105 </section> 106 </div> 107 <div class="copyright"> 108 <div class="maintained"><span>This project is maintained by <a href="mailto:[email protected]">Dstyle</a></span></div> 109 <div class="familysite"> 110 <style> 111 .btn-family{height:24px;border:1px solid #ccc;background:#fff;color:#666;} 112 .btn-family i{color:#666;} 113 114 115 .btn-dstyle span{font-family:'Oswald', sans-serif;} 116 .btn-dstyle:hover{border-top:1px solid #d9534f;border-right:1px dashed #333;border-bottom:1px dashed #333;border-left:1px dashed #333;} 117 .btn-dstyle:hover i{color:#333;} 118 .btn-dstyle:hover span{color:#333;} 119 120 121 .btn-papers span{font-family:'Poiret One', cursive;font-weight:700;} 122 .btn-papers:hover{background:#333;} 123 .btn-papers:hover i{color:#f0ad4e;} 124 .btn-papers:hover span{color:#fff;} 125 126 .btn-sitemaps span{font-family: 'Muli', sans-serif;font-weight:400;} 127 .btn-sitemaps:hover{border:1px solid #adadad;} 128 .btn-sitemaps:hover i{color:#d9534f;} 129 .btn-sitemaps:hover span{color:#333;} 130 131 .btn-imagemap span{font-family:'Pacifico', cursive;font-weight:400;} 132 .btn-imagemap:hover{border:1px solid #adadad;} 133 .btn-imagemap:hover i{color:#5bc0de;} 134 .btn-imagemap:hover span{color:#333;} 135 </style>
136 <a href="http://dstyle0210.github.io/" class="btn btn-xs btn-dstyle btn-family" title="Dstyle - Front-End Developer" target="_blank"><i class="fa fa-user"></i></span> <span>Dstyle</span></a> 137 <a href="http://dstyle0210.github.io/papers/" class="btn btn-xs btn-papers btn-family" title="Papers - Pages Structure Of WebSite" target="_blank"><i class="fa fa-list-ul"></i></span> <span>Papers</span></a> 138 <a href="http://dstyle0210.github.io/sitemap/" class="btn btn-xs btn-sitemaps btn-family" title="Sitemap - front-end developer's favorites bookmarks" target="_blank"><i class="fa fa-bookmark"></i> <span>Sitemaps</span></a> 139 <a href="http://dstyle0210.github.io/imageMap/" class="btn btn-xs btn-imagemap btn-family" title="imagemap - HTML 'imageMap' Algorism Genenater" target="_blank"><i class="fa fa-link"></i> <span><i>i</i>mage<i>M</i>ap</span></a> 140 </div> 141 </div> 142 </div> 143 </div> 144</div> 145 146
147<script type="text/javascript" data-main="js/imagemap" src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.1.20/require.min.js"></script>
vendor: 1 bytes, line 147
147
148<script>
vendor: 369 bytes, lines 148-154
148 149 (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ 150 (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), 151 m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) 152 })(window,document,'script','//www.google-analytics.com/analytics.js','ga'); 153 154 ga('create', '
154UA-56483625-4
vendor: 41 bytes, lines 154-156
154', 'auto'); 155 ga('send', 'pageview'); 156
157</script>
157 158</body> 159</html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.