1<!DOCTYPE html> 2<html lang="ja"> 3 4<head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# article: http://ogp.me/ns/article#"> 5 6<!-- Google Tag Manager -->
7<script>
vendor: 327 bytes, lines 7-11
7(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': 8new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], 9j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= 10'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); 11})(window,document,'script','dataLayer','
11GTM-NM5LGF6
vendor: 3 bytes, line 11
11');
11</script>
11 12<!-- End Google Tag Manager --> 13 14 <!-- ããã©ã¼ãã³ã¹ã®ããã«ä½¿ç¨ããæåã®ã¨ã³ã³ã¼ãã£ã³ã°ãè¨è¿° --> 15 <meta charset="utf-8" /> 16 17 18 <link rel="canonical" href="https://webukatu.com/search/contents1_detail_info?c1id=35150"> 19 20 <!-- ============================================== 21 ã ãµã¤ãã¿ã¤ãã« 22 =============================================== --> 23 <title>HTMLã»CSSé¨ å ¥éãã¼ã¸ | ãå ¥éãåå¿è åãããã°ã©ãã³ã°å¦ç¿ã¹ã¯ã¼ã«ãã¦ã§ãã«ã!!ã</title> 24 25 <!-- ============================================== 26 metaã¿ã° 27 =============================================== --> 28 <meta name="author" content="ã¦ã§ãã«ã!!" /> 29 <meta name="description" content="æªçµé¨ããï¼å¹´ã§å¹´åï¼åä¸ä»¥ä¸ç¨¼ãç¶ããæåã¨ã³ã¸ãã¢ãæãããã©ããããåããããããå¦ã¹ãã©ããããå¹ççãã§ãã©ããããå®è·µçããªåå¿è åãããã°ã©ãã³ã°å¦ç¿ã¹ã¯ã¼ã«ã¨ã¯ï¼" /> 30 <meta name="keywords" content="ããã°ã©ãã³ã°,ã¹ã¯ã¼ã«,åå¿è ,å ¥é,å¦ç¿" /> 31 <meta name="application-name" content="ã¦ã§ãã«ã!! - æ¬æ°ã§åå ¥ãä¸ããã人ã®ããã®ãªã³ã©ã¤ã³ããã°ã©ãã³ã°å¦ç¿ã¹ã¯ã¼ã«" /> 32 33 <!-- ============================================== 34 OGPã¿ã° 35 =============================================== --> 36 <head prefix="og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# article: http://ogp.me/ns/article#"> 37 <meta property="og:title" content="HTMLã»CSSé¨ å ¥éãã¼ã¸" /> 38 <meta property="og:type" content="website" /> 39 <!--ã¾ãã¯website, blog--> 40 <meta property="og:url" content="https://webukatu.com/search/contents1_detail_info?rf=tw" /> 41 <meta property="og:image" content="https://webukatu.com/assets/img/logo_ogp.png" /> 42 <meta property="og:site_name" content="ããã°ã©ãã³ã°ã¹ã¯ã¼ã«ãã¦ã§ãã«ã!!ã" /> 43 <meta property="og:description" content="大æã¹ã¯ã¼ã«çå¾ãç¾å½¹ã¨ã³ã¸ãã¢ã夿°å¦ã³ç´ãã¦ãããå®åã¬ãã«ãã«ç¹åããã稼ããããã®ããã°ã©ãã³ã°ã¹ã¯ã¼ã«" /> 44 <meta name="twitter:card" content="summary_large_image" /> 45 <meta name="twitter:site" content="@webukatu" /> 46 47 48 49 <!-- IE8+ã«å¯¾ãã¦ãIE=edgeãã¨æå®ãããã¨ã§ãå©ç¨ã§ããæãäºææ§ã®é«ãææ°ã®ã¨ã³ã¸ã³ã使ç¨ããããæç¤ºã§ãã --> 50 <meta http-equiv="X-UA-Compatible" content="IE=edge"> 51 52 <!-- ã¢ãã¤ã«ç«¯æ«ã¸ã®å¯¾å¿ããã¼ã¸ããã¥ã¼ãã¼ãã®å¹ ã«åããã¦ã¬ã³ããªã³ã°ï¼Android, iOS6以éï¼ããºã¼ã ã許å¯ããªãè¨å®ãuser-scalable=noãã¯å ããªãæ¹ããã --> 53 <meta name="viewport" content="width=device-width, initial-scale=1"> 54 55 <!-- iOSãªã©ã¹ããã§é»è©±çªå·ãèªåã§é»è©±ãªã³ã¯ã¸æ¸ãæããã®ãé²ã --> 56 <meta name="format-detection" content="telephone=no"> 57 58 <!-- ============================================== 59 Assetå®ç¾© 60 =============================================== --> 61 62 <!-- ============================================== 63 ãCSS 64 =============================================== --> 65 <!-- BootStrap3 --> 66 <link type="text/css" rel="stylesheet" href="https://webukatu.com/assets/css/bootstrap.css?1575572579" /> 67 68 <!-- ãã©ã³ãã¢ã¤ã³ã³ --> 69 <link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap-glyphicons.css" rel="stylesheet" media="print" onload="this.media='all'"> 70 <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet" media="print" onload="this.media='all'"> 71 <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.3.1/css/all.css" integrity="sha384-mzrmE5qonljUremFsqc01SB46JvROS7bZs3IO2EmfFsd15uHvIt+Y8vEf7N7fWAU" crossorigin="anonymous" media="print" onload="this.media='all'"> 72 73 <!-- ç»åã¹ã©ã¤ãã¼ --> 74 <link type="text/css" rel="stylesheet" href="https://webukatu.com/assets/js/flexslider.css?1575572580" /> 75 76 <!-- iCheck --> 77 <link type="text/css" rel="stylesheet" href="https://webukatu.com/assets/css/skins/flat/red.css?1575572579" /> 78 79 <!-- DateTimePicker --> 80 <link type="text/css" rel="stylesheet" href="https://webukatu.com/assets/css/jquery.datetimepicker.css?1575572579" /> 81 82 <!-- TimePicker --> 83 <link type="text/css" rel="stylesheet" href="https://webukatu.com/assets/css/bootstrap-timepicker.css?1575572579" /> 84 85 <!-- ã¹ã¿ã¤ã«ã·ã¼ã --> 86 <link type="text/css" rel="stylesheet" href="https://webukatu.com/assets/css/style.css?1637572330" /> 87 88 <link type="text/css" rel="stylesheet" href="https://webukatu.com/assets/css/animate.css?1575572579" /> 89 90 <!-- IE8以ä¸ç¨ã«2ã¤ã®ã¹ã¯ãªãããè¨è¿° 91 html5shiv.js: IE8以ä¸ã«HTML5ã®è¦ç´ ãèªèããããã«ããã 92 respond.js: IE8以ä¸ã«Media Queriesã®ä»£æ¿ãæ©è½ãæä¾ --> 93 <!--[if lt IE 9]> 94
94<script src="//cdn.jsdelivr.net/html5shiv/3.7.2/html5shiv.min.js"></script>
94 95
95<script src="//cdnjs.cloudflare.com/ajax/libs/respond.js/1.4.2/respond.min.js"></script>
95 96 <![endif]--> 97 98 <!-- ============================================== 99 ãFavicons 100 =============================================== --> 101 <link rel="shortcut icon" href="assets/img/ico/favicon.ico" type="image/vnd.microsoft.icon"> 102 <link rel="apple-touch-icon-precomposed" sizes="114x114" href="assets/img/ico/apple-touch-icon-precomposed.png"> 103 104 105 <!-- ============================================== 106 ãFonts 107 =============================================== --> 108 <link href="https://fonts.googleapis.com/css?family=Montserrat:700" rel="stylesheet" media="print" onload="this.media='all'"> 109 <link href="https://fonts.googleapis.com/earlyaccess/mplus1p.css" rel="stylesheet" media="print" onload="this.media='all'"> 110 <link href="https://fonts.googleapis.com/css?family=Cinzel" rel="stylesheet" media="print" onload="this.media='all'"> 111 <link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet" media="print" onload="this.media='all'"> 112 <link href="https://fonts.googleapis.com/css?family=Oswald" rel="stylesheet" media="print" onload="this.media='all'"> 113 <link href="https://fonts.googleapis.com/css2?family=Noto+Sans+JP&display=swap" rel="stylesheet" media="print" onload="this.media='all'"> 114 <link rel="canonical" href="https://webukatu.com/" /> 115 116 117 118 <!-- ============================================== 119 ãJavaScript 120 =============================================== --> 121 <!-- Googleãã©ããã³ã°ã³ã¼ã --> 122
122<script async>
vendor: 442 bytes, lines 122-135
122 123 (function(i, s, o, g, r, a, m) { 124 i['GoogleAnalyticsObject'] = r; 125 i[r] = i[r] || function() { 126 (i[r].q = i[r].q || []).push(arguments) 127 }, i[r].l = 1 * new Date(); 128 a = s.createElement(o), 129 m = s.getElementsByTagName(o)[0]; 130 a.async = 1; 131 a.src = g; 132 m.parentNode.insertBefore(a, m) 133 })(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga'); 134 135 ga('create', '
135UA-30125803-4
vendor: 42 bytes, lines 135-137
135', 'auto'); 136 ga('send', 'pageview'); 137
137</script>
137 138 139 <!-- GoogleMap --> 140
140<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false" async></script>
140 141 <!-- GoogleMap --> 142
142<script type="text/javascript" src="https://webukatu.com/assets/js/google_map.js?1575572580"></script>
142 143 144
144<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
144 145 146 147 <link type="text/css" rel="stylesheet" href="https://webukatu.com/assets/css/redactor/redactor.min.css?1519281086" /> 148
148<script type="text/javascript" src="https://webukatu.com/assets/js/redactor/redactor.js?1633567422"></script>
148 149
149<script type="text/javascript" src="https://webukatu.com/assets/js/redactor/plugins/source.js?1575572580"></script>
149 150
150<script type="text/javascript" src="https://webukatu.com/assets/js/redactor/plugins/fullscreen.js?1575572580"></script>
150 151
151<script type="text/javascript" src="https://webukatu.com/assets/js/redactor/plugins/table.js?1575572580"></script>
151 152 <link type="text/css" rel="stylesheet" /> 153
153<script type="text/javascript" src="https://webukatu.com/assets/js/redactor/plugins/fontcolor.js?1575572580"></script>
153 154
154<script type="text/javascript" src="https://webukatu.com/assets/js/vue.min.js?1576268595"></script>
154 155 156 157
157<script type="text/javascript"> 158 $(function() { 159 $('#textarea_editor').redactor({ 160 plugins: ['source', 'fullscreen', 'codemirror', 'table', 'fontcolor'], 161 imageUpload: 'https://webukatu.com/upload/img/', 162 codemirror: { 163 lineNumbers: true, 164 mode: 'xml', 165 indentUnit: 4 166 } 167 }); 168 }); 169 </script>
169 170 171 172 173 174 175 <!-- Global site tag (gtag.js) - Google Ads: 824163405 -->
vendor: 66 bytes, lines 175-176
175 176 <script async src="https://www.googletagmanager.com/gtag/js?id=
176AW-824163405
vendor: 14 bytes, lines 176-177
176"></script> 177
177<script> 178
vendor: 154 bytes, lines 178-185
178window.dataLayer = window.dataLayer || []; 179 180 function gtag() { 181 dataLayer.push(arguments); 182 } 183 gtag('js', new Date()); 184 185 gtag('config', '
185AW-824163405
vendor: 6 bytes, lines 185-186
185'); 186
186</script>
186 187 188 189</head> 190 191<body> 192 193<!-- Google Tag Manager (noscript) -->
vendor: 68 bytes, lines 193-194
193 194<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=
194GTM-NM5LGF6
vendor: 83 bytes, lines 194-195
194" 195height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
196<!-- End Google Tag Manager (noscript) --> 197 198
198<script> 199 window.fbAsyncInit = function() { 200 FB.init({ 201 appId: '393522627485193', 202 cookie: true, 203 xfbml: true, 204 version: 'v2.8' 205 }); 206 FB.AppEvents.logPageView(); 207 }; 208 209 (function(d, s, id) { 210 var js, fjs = d.getElementsByTagName(s)[0]; 211 if (d.getElementById(id)) { 212 return; 213 } 214 js = d.createElement(s); 215 js.id = id; 216 js.src = "//connect.facebook.net/en_US/sdk.js"; 217 fjs.parentNode.insertBefore(js, fjs); 218 }(document, 'script', 'facebook-jssdk')); 219 </script>
219 220 221 <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/rainbow.min.css" media="print" onload="this.media='all'"> 222
222<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/highlight.min.js"></script>
222 223
223<script> 224 hljs.initHighlightingOnLoad(); 225 </script>
225 226 227 228 <!-- ============================================== 229 ãã¼ãã£ã³ã° 230 =============================================== --> 231 <!-- 232 <div id="loading"> 233 <div class="height-middle"> 234 <img alt="" /> </div> 235 </div> 236 --> 237
237<script type="text/javascript" src="https://webukatu.com/assets/js/underscore-min.js?1575572580"></script>
237 238 239 <!-- start #page --> 240 <div id="page" class="container"> 241 <!--<div style="padding-left:30px;">--> 242 <!-- ============================================== 243 ã«ãã´ãªï¼ãã¥ã¼ 244 å½¹å²ï¼åºè詳細ç»é¢ 245=============================================== --> 246 247<!-- 飿³é åã®æåã®ãã¼ãåå¾ --> 248 249<!-- ============================================== 250 ãããã¼ããã²ã¼ã·ã§ã³ 251=============================================== --> 252 253<style> 254@media screen and (max-width: 1080px){ 255 header a.sp-menu { 256 visibility: visible; 257 display: block; 258 margin-top: 15px; 259 float: right; 260 font-size: 10px; 261 background: none; 262 color: #333; 263 } 264 header a.sp-menu i { 265 font-size: 30px; 266 margin: 0 !important; 267 padding: 0 !important; 268 } 269 .menu-wrap { 270 display: none; 271 } 272 #top-menu, #top-menu ul, #top-menu ul li{ 273 width:100%; 274 } 275 nav { 276 height: auto; 277 } 278 #top-menu ul li { 279 text-align: center; 280 } 281} 282@media (min-width: 1081px){ 283.col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12,.col-md-10a,.col-lg-10a { 284 float: left; 285} 286.col-md-10a,.col-lg-10a { 287 width: 83.33333333%; 288} 289} 290</style> 291 292<div class="row top-line"> 293</div> 294<div class="row header" id="header"> 295 <header> 296 <div class="col-lg-12"> 297 <div class="row"> 298 299 <!-- ãã´ --> 300 <div class="col-lg-2 col-md-2"> 301 <div id="top-logo" class="ft-family1"> 302 <a href="https://webukatu.com/home"> 303 <img class="img-responsive" id="top-logo" src="https://webukatu.com/assets/img/logo.png?1575572580" alt="" /> </a> 304 </div> 305 </div><!-- end ãã´ --> 306 307 308 <!-- ãããã¼ãã --> 309 <div class="col-lg-10a col-md-10a" style="padding:0 5px;"> 310 311 312 <!-- ã¹ããç¨ã¡ãã¥ã¼è¡¨ç¤ºãã¿ã³ --> 313 <a class="btn btn-detail sp-menu" id="menu-toggle"><i 314 class="fa fa-bars"></i><br/>MENU</a> 315 316 <!-- ãããããã¡ãã¥ã¼ --> 317 <nav id="top-menu" class="menu-wrap" role="navigation"> 318 319 <ul> 320 321 <li> 322 <a href="https://webukatu.com/search/contents1_list"><i class="fas fa-chalkboard-teacher"></i> 鍿´»ä¸è¦§</a> </li> 323 <li> 324 <a href="https://webukatu.com/plan/list"><i class="fa fa-jpy"></i> é¨è²»</a> </li> 325 326 327 328 <li> 329 <a href="https://webukatu.com/wordpress"><i class="fas fa-pen-nib"></i> å ¬å¼BLOG</a> </li> 330 <li> 331 <a href="https://webukatu.com/auth"><i class="fa fa-unlock"></i> ç»æ ¡ãã</a> </li> 332 <li> 333 <a class="btn btn-big btn-primary mt10 btn-nav" style="height:auto;" href="https://webukatu.com/signup"><i class="fas fa-pencil-alt"></i> ç¡æã§åè¬ãã¦ã¿ã</a> </li> 334 </ul> 335 </nav> 336 337 </div><!-- end ãããã¼ãã --> 338 339 </div> 340 </div><!-- end .col --> 341 </header> 342</div><!-- end .row --> 343 344<div class="row site-width breadcrumb-container"> 345 <section> 346 <div class="col-lg-12"> 347 <!-- ============================================== 348 ã«ãã´ãªï¼ãã¥ã¼ 349 å½¹å²ï¼åºè詳細ç»é¢ã®ãã³ãããªã¹ã 350=============================================== --> 351 352<!-- ãã³ãããªã¹ã --> 353<div class="breadcrumb"> 354 <a href="https://webukatu.com/home"><i class="fa fa-home"></i></a> > 355 356 <a href="https://webukatu.com/search/contents1_list"> 357 鍿´»åä¸è¦§ 358 </a> > 359 360 HTMLã»CSSé¨ å ¥é</div> </div> 361 </section> 362</div> 363 364<div id="main"> 365 366 <!-- ============================================== 367 åºèæ å ±ç»é¢
368 =============================================== --> 369 <div class="row top-contents site-width"> 370 <section> 371 372 <div class="col-lg-9 col-md-9 col-sm-9"> 373 374 <!-- åºèããã --> 375 <!-- 飿³é åã®æåã®ãã¼ãåå¾ --> 376 377 378<!-- é²è¦§æ°ã«ã¦ã³ãã¢ãã --> 379 380<!-- åºèããã --> 381<div class="row mb20"> 382 <div class="col-lg-12"> 383 384 <div class="row"> 385 <div class="col-lg-12"> 386 <div class="panel panel-naked"> 387 <h1 class="title page-title-color1">HTMLã»CSSé¨ å ¥é</h1> 388 <div class="row comment mb20"> 389 <div class="col-lg-12"> 390 <img class="img-responsive img-bd" alt="鍿´»ãããç»å" id="pic1" src="https://webukatu.com/assets/uploads/../uploads/img/92e0bf73c1ddc41cee15e953de9c14f69c0f71c7html-easy4bf9a0fdded0c1a2ab018698377419f3c7a21cc0.jpg?1575572580" /> </div> 391 <div class="col-lg-12"> 392 <div class="comemnt"> 393 <p style="background:#F0F2F4; padding:15px; border:1px solid #ccc; margin-top:-1px;"> 394 ãã¼ã ãã¼ã¸ãä½ãä¸ã§ä¸çªæåã«å¦ã¶ã®ãHTMLè¨èªã¨CSSè¨èªããã®ï¼ã¤ã®ããã°ã©ãã³ã°è¨èªã使ããããã«ãªãã¨ãåºæ¬çãªãã¼ã ãã¼ã¸ãä½ããããã«ãªãã¾ãï¼WEBãµã¼ãã¹ã»WEBã¢ããªã¯ãã®ãã¼ã ãã¼ã¸ã«è²ã ãªãã®ãå ãããã¨ã§åºæ¥ã¦ããã®ã§ãWEBãµã¼ãã¹ã®åºç¤ã¨ãªãã¹ãã«ã§ãã </p> 395 </div> 396 </div> 397 </div> 398 399 <div class="row comment mb20"> 400 <div class="col-lg-12"> 401 <h2 style="font-size:1rem; text-align:center;" class="mb20"><b>ãã®é¨æ´»ã§ä½ããã®</b></h2> 402 <img class="img-responsive img-bd" alt="鍿´»ã§ä½ããã®" id="pic2" src="https://webukatu.com/assets/uploads/../uploads/img/a5c7b5e296ee8999f5d73e430960e5b0a8f88f87seikabutu01ec30468bd060eaa4e07e230287f0a87b09fff72e.png?1575572580" /> </div> 403 </div> 404 405 <div class="panel-body radius-bottom" style="background:white; padding:15px !important;"> 406 407 <div class="row mb10"> 408 <div class="col-lg-12 btn-block" style="text-align:center;"> 409 </div> 410 </div> 411 412 413 414 </div> 415 416 </div> 417 </div> 418 </div> 419 420 </div> 421</div> 422 423 <div class="row" style="border-top:1px solid #ccc;"> 424 <div class="col-lg-12"> 425 426 <div class="panel plain panel-default panel-shop-base"> 427 428 <div class="panel-body"> 429 <h2 class="bg-brown3 brall text-adjust block p5 mb20 t-center" style="font-size:1.3rem;"> 430 <b>HTMLã»CSSé¨ å ¥éã®ç·´ç¿ã¡ãã¥ã¼</b></h2> 431 432 <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12" style="background: #F6F5F5;"> 433 <div class="t-center" 434 style="background:#F6F5F5; padding:25px;"> 435 <p class="mb10">ã¬ãã¹ã³ä¸è¦§ã¯ã¬ãã¹ã³ãé²ãã¦ãããã¨ã«ã²ã¼ã ã®ããã«è§£æ¾ããã¦ããã¾ãï¼</p> 436 <a class="btn btn-primary" 437 style="font-size: 14px;margin-top: 14px;font-weight: bold;padding:10px 25px;" 438 href="https://webukatu.com/signup">ç¡æã§åè¬ãã¦ã¿ã</a> 439 </div> 440 </div> 441 442 <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12"> 443 444 <div class="col-lg-12 table-option ctn2-list-container pt10 pb10" style="border-bottom:1px solid #ccc;position: relative;"> 445 <p style="position: absolute;left: calc(50% - 120px);top: calc(50% - 10px);z-index: 3;font-size: 1em;font-weight:bold;color:#666;text-shadow: 0 0 10px #fff">
446 次ã®ç·´ç¿ã¸é²ã ãã¿ã³ã§è§£é¤ 447 </p> 448 <i class="fa fa-lock" style="position: absolute;left: calc(50% - 35px);top: calc(50% - 28px);z-index: 1;font-size: 3.5em;opacity: .7;"></i> 449 <div class="ctn panel panel-naked mb20 ctn2-list-mini"> 450 <div class="col-lg-10 col-md-10 col-sm-10"> 451 <div class="panel-head" style="height:auto; padding: 5px;"> 452 <h3 class="list-title" style="text-align:left;font-size:16px"><span style="filter: blur(4px);-ms-filter: blur(4px);">Lesson 01ãHTMLã¨ã¯ï¼ã </span></h3><p class="comment" style="font-size:0.8rem; padding:10px;text-align:left; min-height:60px;"><span style="filter: blur(4px);-ms-filter: blur(4px);">HTMLè¨èªã¨ã¯ãã£ãããªããªã®ãï¼ï¼ï¼åã¡ãã£ã¨ã§åããããã解説ï¼ï¼</span></p> </div> 453 </div><div class="col-lg-2 col-md-2 col-sm-2"> 454 <div class="panel-body img-liquid list-img" style="display:block;"><label class="label label-warning fl-right" style="border-radius:0; margin:0;">ãã¬ãã¢ã </label><img src="http://i.ytimg.com/vi/0.jpg" alt="" /></div> 455 </div></div> 456 </div> <div class="col-lg-12 table-option ctn2-list-container pt10 pb10" style="border-bottom:1px solid #ccc;position: relative;"> 457 <p style="position: absolute;left: calc(50% - 120px);top: calc(50% - 10px);z-index: 3;font-size: 1em;font-weight:bold;color:#666;text-shadow: 0 0 10px #fff"> 458 次ã®ç·´ç¿ã¸é²ã ãã¿ã³ã§è§£é¤ 459 </p> 460 <i class="fa fa-lock" style="position: absolute;left: calc(50% - 35px);top: calc(50% - 28px);z-index: 1;font-size: 3.5em;opacity: .7;"></i> 461 <div class="ctn panel panel-naked mb20 ctn2-list-mini"> 462 <div class="col-lg-10 col-md-10 col-sm-10"> 463 <div class="panel-head" style="height:auto; padding: 5px;"> 464 <h3 class="list-title" style="text-align:left;font-size:16px"><span style="filter: blur(4px);-ms-filter: blur(4px);">Lesson 02ãHTMLã®æ¸ãæ¹ã</span></h3><p class="comment" style="font-size:0.8rem; padding:10px;text-align:left; min-height:60px;"><span style="filter: blur(4px);-ms-filter: blur(4px);">HTMLã®æ§æã¨åºæ¬çãªæ¸ãæ¹ãç¡æã®ããã¹ãã¨ãã£ã¿ã½ãããCotEditorãã使ã£ã¦å¦ãã§ããã¾ãã</span></p> </div> 465 </div><div class="col-lg-2 col-md-2 col-sm-2"> 466 <div class="panel-body img-liquid list-img" style="display:block;"><label class="label label-warning fl-right" style="border-radius:0; margin:0;">ãã¬ãã¢ã </label><img src="http://i.ytimg.com/vi/0.jpg" alt="" /></div> 467 </div></div> 468 </div> <div class="col-lg-12 table-option ctn2-list-container pt10 pb10" style="border-bottom:1px solid #ccc;position: relative;"> 469 <p style="position: absolute;left: calc(50% - 120px);top: calc(50% - 10px);z-index: 3;font-size: 1em;font-weight:bold;color:#666;text-shadow: 0 0 10px #fff"> 470 次ã®ç·´ç¿ã¸é²ã ãã¿ã³ã§è§£é¤ 471 </p> 472 <i class="fa fa-lock" style="position: absolute;left: calc(50% - 35px);top: calc(50% - 28px);z-index: 1;font-size: 3.5em;opacity: .7;"></i> 473 <div class="ctn panel panel-naked mb20 ctn2-list-mini"> 474 <div class="col-lg-10 col-md-10 col-sm-10"> 475 <div class="panel-head" style="height:auto; padding: 5px;"> 476 <h3 class="list-title" style="text-align:left;font-size:16px"><span style="filter: blur(4px);-ms-filter: blur(4px);">Lesson 03ãç»åã表示ããã¦ã¿ããï¼ã </span></h3><p class="comment" style="font-size:0.8rem; padding:10px;text-align:left; min-height:60px;"><span style="filter: blur(4px);-ms-filter: blur(4px);">imgã¿ã°ã使ã£ã¦ãã¼ã ãã¼ã¸ã«ç»åã表示ããã¦ã¿ã¾ãããï¼</span></p> </div> 477 </div><div class="col-lg-2 col-md-2 col-sm-2"> 478 <div class="panel-body img-liquid list-img" style="display:block;"><label class="label label-warning fl-right" style="border-radius:0; margin:0;">ãã¬ãã¢ã </label><img src="http://i.ytimg.com/vi/0.jpg" alt="" /></div> 479 </div></div> 480 </div> <div class="col-lg-12 table-option ctn2-list-container pt10 pb10" style="border-bottom:1px solid #ccc;position: relative;"> 481 <p style="position: absolute;
481left: calc(50% - 120px);top: calc(50% - 10px);z-index: 3;font-size: 1em;font-weight:bold;color:#666;text-shadow: 0 0 10px #fff"> 482 次ã®ç·´ç¿ã¸é²ã ãã¿ã³ã§è§£é¤ 483 </p> 484 <i class="fa fa-lock" style="position: absolute;left: calc(50% - 35px);top: calc(50% - 28px);z-index: 1;font-size: 3.5em;opacity: .7;"></i> 485 <div class="ctn panel panel-naked mb20 ctn2-list-mini"> 486 <div class="col-lg-10 col-md-10 col-sm-10"> 487 <div class="panel-head" style="height:auto; padding: 5px;"> 488 <h3 class="list-title" style="text-align:left;font-size:16px"><span style="filter: blur(4px);-ms-filter: blur(4px);">Lesson 04ããªã³ã¯ã使ã£ã¦ç»é¢ãåãæ¿ãããï¼ã</span></h3><p class="comment" style="font-size:0.8rem; padding:10px;text-align:left; min-height:60px;"><span style="filter: blur(4px);-ms-filter: blur(4px);">aã¿ã°ã使ã£ã¦ãªã³ã¯ãä½ã£ã¦ã¿ããï¼ 489ç»é¢é·ç§»ï¼ç»é¢ã®åæ¿ï¼ãã§ããããã«ãªããï¼</span></p> </div> 490 </div><div class="col-lg-2 col-md-2 col-sm-2"> 491 <div class="panel-body img-liquid list-img" style="display:block;"><label class="label label-warning fl-right" style="border-radius:0; margin:0;">ãã¬ãã¢ã </label><img src="http://i.ytimg.com/vi/0.jpg" alt="" /></div> 492 </div></div> 493 </div> <div class="col-lg-12 table-option ctn2-list-container pt10 pb10" style="border-bottom:1px solid #ccc;position: relative;"> 494 <p style="position: absolute;left: calc(50% - 120px);top: calc(50% - 10px);z-index: 3;font-size: 1em;font-weight:bold;color:#666;text-shadow: 0 0 10px #fff"> 495 次ã®ç·´ç¿ã¸é²ã ãã¿ã³ã§è§£é¤ 496 </p> 497 <i class="fa fa-lock" style="position: absolute;left: calc(50% - 35px);top: calc(50% - 28px);z-index: 1;font-size: 3.5em;opacity: .7;"></i> 498 <div class="ctn panel panel-naked mb20 ctn2-list-mini"> 499 <div class="col-lg-10 col-md-10 col-sm-10"> 500 <div class="panel-head" style="height:auto; padding: 5px;"> 501 <h3 class="list-title" style="text-align:left;font-size:16px"><span style="filter: blur(4px);-ms-filter: blur(4px);">Lesson 05ã表ãä½ã£ã¦ã¿ããï¼ã </span></h3><p class="comment" style="font-size:0.8rem; padding:10px;text-align:left; min-height:60px;"><span style="filter: blur(4px);-ms-filter: blur(4px);">tableã¿ã°ãtrã¿ã°ãtdã¿ã°ã使ã£ã¦è¡¨ãä½ã£ã¦ã¿ã¾ãããï¼</span></p> </div> 502 </div><div class="col-lg-2 col-md-2 col-sm-2"> 503 <div class="panel-body img-liquid list-img" style="display:block;"><label class="label label-warning fl-right" style="border-radius:0; margin:0;">ãã¬ãã¢ã </label><img src="http://i.ytimg.com/vi/0.jpg" alt="" /></div> 504 </div></div> 505 </div> <div class="col-lg-12 table-option ctn2-list-container pt10 pb10" style="border-bottom:1px solid #ccc;position: relative;"> 506 <p style="position: absolute;left: calc(50% - 120px);top: calc(50% - 10px);z-index: 3;font-size: 1em;font-weight:bold;color:#666;text-shadow: 0 0 10px #fff"> 507 次ã®ç·´ç¿ã¸é²ã ãã¿ã³ã§è§£é¤ 508 </p> 509 <i class="fa fa-lock" style="position: absolute;left: calc(50% - 35px);top: calc(50% - 28px);z-index: 1;font-size: 3.5em;opacity: .7;"></i> 510 <div class="ctn panel panel-naked mb20 ctn2-list-mini"> 511 <div class="col-lg-10 col-md-10 col-sm-10"> 512 <div class="panel-head" style="height:auto; padding: 5px;"> 513 <h3 class="list-title" style="text-align:left;font-size:16px"><span style="filter: blur(4px);-ms-filter: blur(4px);">ã³ã¼ãã¼ãã¬ã¤ã¯ãããã¯ã¨ã³ãããããã³ãã¨ã³ãã稼ããããã¦ç¾å³ããçç±ã</span></h3> </div> 514 </div><div class="col-lg-2 col-md-2 col-sm-2"> 515 <div class="panel-body img-liquid list-img" style="display:block;"><label class="label label-warning fl-right" style="border-radius:0; margin:0;">ãã¬ãã¢ã </label><img src="http://i.ytimg.com/vi/0.jpg" alt="" /></div> 516 </div></div> 517 </div> <div class="col-lg-12 table-option ctn2-list-container pt10 pb10" style="border-bottom:1px solid #ccc;position: relative;"> 518 <p style="position: absolute;
518left: calc(50% - 120px);top: calc(50% - 10px);z-index: 3;font-size: 1em;font-weight:bold;color:#666;text-shadow: 0 0 10px #fff"> 519 次ã®ç·´ç¿ã¸é²ã ãã¿ã³ã§è§£é¤ 520 </p> 521 <i class="fa fa-lock" style="position: absolute;left: calc(50% - 35px);top: calc(50% - 28px);z-index: 1;font-size: 3.5em;opacity: .7;"></i> 522 <div class="ctn panel panel-naked mb20 ctn2-list-mini"> 523 <div class="col-lg-10 col-md-10 col-sm-10"> 524 <div class="panel-head" style="height:auto; padding: 5px;"> 525 <h3 class="list-title" style="text-align:left;font-size:16px"><span style="filter: blur(4px);-ms-filter: blur(4px);">Lesson 06ããªã¹ããä½ã£ã¦ã¿ããï¼ã </span></h3><p class="comment" style="font-size:0.8rem; padding:10px;text-align:left; min-height:60px;"><span style="filter: blur(4px);-ms-filter: blur(4px);">ul,liã¿ã°ã使ã£ã¦ãªã¹ããä½ã£ã¦ã¿ããï¼ 526ãªã¹ãã¯ãã¼ã ãã¼ã¸ã®ã¡ãã¥ã¼ãªã©ã«ã使ããã¦ãããï¼</span></p> </div> 527 </div><div class="col-lg-2 col-md-2 col-sm-2"> 528 <div class="panel-body img-liquid list-img" style="display:block;"><label class="label label-warning fl-right" style="border-radius:0; margin:0;">ãã¬ãã¢ã </label><img src="http://i.ytimg.com/vi/0.jpg" alt="" /></div> 529 </div></div> 530 </div> <div class="col-lg-12 table-option ctn2-list-container pt10 pb10" style="border-bottom:1px solid #ccc;position: relative;"> 531 <p style="position: absolute;left: calc(50% - 120px);top: calc(50% - 10px);z-index: 3;font-size: 1em;font-weight:bold;color:#666;text-shadow: 0 0 10px #fff"> 532 次ã®ç·´ç¿ã¸é²ã ãã¿ã³ã§è§£é¤ 533 </p> 534 <i class="fa fa-lock" style="position: absolute;left: calc(50% - 35px);top: calc(50% - 28px);z-index: 1;font-size: 3.5em;opacity: .7;"></i> 535 <div class="ctn panel panel-naked mb20 ctn2-list-mini"> 536 <div class="col-lg-10 col-md-10 col-sm-10"> 537 <div class="panel-head" style="height:auto; padding: 5px;"> 538 <h3 class="list-title" style="text-align:left;font-size:16px"><span style="filter: blur(4px);-ms-filter: blur(4px);">Lesson 07ããã©ã¼ã ãä½ã£ã¦ã¿ããï¼ã</span></h3><p class="comment" style="font-size:0.8rem; padding:10px;text-align:left; min-height:60px;"><span style="filter: blur(4px);-ms-filter: blur(4px);">ããã¹ãããã¯ã¹ããã§ãã¯ããã¯ã¹ãã©ã¸ãªãã¿ã³ã«ã»ã¬ã¯ãããã¯ã¹ãããã¹ãã¨ãªã¢ãªã©ã 539ãååããã©ã¼ã ãã¦ã¼ã¶ã¼ç»é²ãã©ã¼ã ãªã©WEBã¢ããªã±ã¼ã·ã§ã³ã«ã¯æ¬ ãããªããã©ã¼ã ã®ä½ãæ¹ãå¦ãã§ãããï¼ 540</span></p> </div> 541 </div><div class="col-lg-2 col-md-2 col-sm-2"> 542 <div class="panel-body img-liquid list-img" style="display:block;"><label class="label label-warning fl-right" style="border-radius:0; margin:0;">ãã¬ãã¢ã </label><img src="http://i.ytimg.com/vi/0.jpg" alt="" /></div> 543 </div></div> 544 </div> <div class="col-lg-12 table-option ctn2-list-container pt10 pb10" style="border-bottom:1px solid #ccc;position: relative;"> 545 <p style="position: absolute;left: calc(50% - 120px);top: calc(50% - 10px);z-index: 3;font-size: 1em;font-weight:bold;color:#666;text-shadow: 0 0 10px #fff"> 546 次ã®ç·´ç¿ã¸é²ã ãã¿ã³ã§è§£é¤ 547 </p> 548 <i class="fa fa-lock" style="position: absolute;left: calc(50% - 35px);top: calc(50% - 28px);z-index: 1;font-size: 3.5em;opacity: .7;"></i> 549 <div class="ctn panel panel-naked mb20 ctn2-list-mini"> 550 <div class="col-lg-10 col-md-10 col-sm-10"> 551 <div class="panel-head" style="height:auto; padding: 5px;"> 552 <h3 class="list-title" style="text-align:left;font-size:16px"><span style="filter: blur(4px);-ms-filter: blur(4px);">ã³ã¼ãã¼ãã¬ã¤ã¯ãç«¶äºã¨ã¯ãªãã ããï¼å¦ç¿ã¨ã¯ãªãã ããï¼ã</span></h3> </div> 553 </div><div class="col-lg-2 col-md-2 col-sm-2"> 554 <div class="panel-body img-liquid list-img" style="display:block;"><label class="label label-warning fl-right" style="border-radius:0; margin:0;">ãã¬ãã¢ã </label><img src="http://i.ytimg.com/vi/0.jpg" alt="" /></div> 555 </div></div> 556 </div> <div class="col-lg-12 table-option ctn2-list-container pt10 pb10" style="border-bottom:1px solid #ccc;position: relative;"> 557 <p style="position: absolute;
557left: calc(50% - 120px);top: calc(50% - 10px);z-index: 3;font-size: 1em;font-weight:bold;color:#666;text-shadow: 0 0 10px #fff"> 558 次ã®ç·´ç¿ã¸é²ã ãã¿ã³ã§è§£é¤ 559 </p> 560 <i class="fa fa-lock" style="position: absolute;left: calc(50% - 35px);top: calc(50% - 28px);z-index: 1;font-size: 3.5em;opacity: .7;"></i> 561 <div class="ctn panel panel-naked mb20 ctn2-list-mini"> 562 <div class="col-lg-10 col-md-10 col-sm-10"> 563 <div class="panel-head" style="height:auto; padding: 5px;"> 564 <h3 class="list-title" style="text-align:left;font-size:16px"><span style="filter: blur(4px);-ms-filter: blur(4px);">Lesson 08ãCSSã£ã¦ãªã«ï¼ã</span></h3><p class="comment" style="font-size:0.8rem; padding:10px;text-align:left; min-height:60px;"><span style="filter: blur(4px);-ms-filter: blur(4px);">CSSè¨èªã¨ã¯ãã£ãããªããªã®ãï¼ 5652åã§ããã£ã¨è§£èª¬ãã¾ãï¼</span></p> </div> 566 </div><div class="col-lg-2 col-md-2 col-sm-2"> 567 <div class="panel-body img-liquid list-img" style="display:block;"><label class="label label-warning fl-right" style="border-radius:0; margin:0;">ãã¬ãã¢ã </label><img src="http://i.ytimg.com/vi/0.jpg" alt="" /></div> 568 </div></div> 569 </div> <div class="col-lg-12 table-option ctn2-list-container pt10 pb10" style="border-bottom:1px solid #ccc;position: relative;"> 570 <p style="position: absolute;left: calc(50% - 120px);top: calc(50% - 10px);z-index: 3;font-size: 1em;font-weight:bold;color:#666;text-shadow: 0 0 10px #fff"> 571 次ã®ç·´ç¿ã¸é²ã ãã¿ã³ã§è§£é¤ 572 </p> 573 <i class="fa fa-lock" style="position: absolute;left: calc(50% - 35px);top: calc(50% - 28px);z-index: 1;font-size: 3.5em;opacity: .7;"></i> 574 <div class="ctn panel panel-naked mb20 ctn2-list-mini"> 575 <div class="col-lg-10 col-md-10 col-sm-10"> 576 <div class="panel-head" style="height:auto; padding: 5px;"> 577 <h3 class="list-title" style="text-align:left;font-size:16px"><span style="filter: blur(4px);-ms-filter: blur(4px);">Lesson 09ãCSSã®æ¸ãæ¹ã </span></h3><p class="comment" style="font-size:0.8rem; padding:10px;text-align:left; min-height:60px;"><span style="filter: blur(4px);-ms-filter: blur(4px);">CSSè¨èªã®æ¸ãæ¹ãå¦ç¿ãã¦ããã¾ãã</span></p> </div> 578 </div><div class="col-lg-2 col-md-2 col-sm-2"> 579 <div class="panel-body img-liquid list-img" style="display:block;"><label class="label label-warning fl-right" style="border-radius:0; margin:0;">ãã¬ãã¢ã </label><img src="http://i.ytimg.com/vi/0.jpg" alt="" /></div> 580 </div></div> 581 </div> <div class="col-lg-12 table-option ctn2-list-container pt10 pb10" style="border-bottom:1px solid #ccc;position: relative;"> 582 <p style="position: absolute;left: calc(50% - 120px);top: calc(50% - 10px);z-index: 3;font-size: 1em;font-weight:bold;color:#666;text-shadow: 0 0 10px #fff"> 583 次ã®ç·´ç¿ã¸é²ã ãã¿ã³ã§è§£é¤ 584 </p> 585 <i class="fa fa-lock" style="position: absolute;left: calc(50% - 35px);top: calc(50% - 28px);z-index: 1;font-size: 3.5em;opacity: .7;"></i> 586 <div class="ctn panel panel-naked mb20 ctn2-list-mini"> 587 <div class="col-lg-10 col-md-10 col-sm-10"> 588 <div class="panel-head" style="height:auto; padding: 5px;"> 589 <h3 class="list-title" style="text-align:left;font-size:16px"><span style="filter: blur(4px);-ms-filter: blur(4px);">Lesson 10ãid屿§ã¨class屿§ã</span></h3><p class="comment" style="font-size:0.8rem; padding:10px;text-align:left; min-height:60px;"><span style="filter: blur(4px);-ms-filter: blur(4px);">ã¹ã¿ã¤ã«æå®ã®å¹ ãåºããid屿§ã¨class屿§ã«ã¤ãã¦å¦ç¿ãã¦ããã¾ãã</span></p> </div> 590 </div><div class="col-lg-2 col-md-2 col-sm-2"> 591 <div class="panel-body img-liquid list-img" style="display:block;"><label class="label label-warning fl-right" style="border-radius:0; margin:0;">ãã¬ãã¢ã </label><img src="http://i.ytimg.com/vi/0.jpg" alt="" /></div> 592 </div></div> 593 </div> <div class="col-lg-12 table-option ctn2-list-container pt10 pb10" style="border-bottom:1px solid #ccc;position: relative;"> 594 <p style="position: absolute;
594left: calc(50% - 120px);top: calc(50% - 10px);z-index: 3;font-size: 1em;font-weight:bold;color:#666;text-shadow: 0 0 10px #fff"> 595 次ã®ç·´ç¿ã¸é²ã ãã¿ã³ã§è§£é¤ 596 </p> 597 <i class="fa fa-lock" style="position: absolute;left: calc(50% - 35px);top: calc(50% - 28px);z-index: 1;font-size: 3.5em;opacity: .7;"></i> 598 <div class="ctn panel panel-naked mb20 ctn2-list-mini"> 599 <div class="col-lg-10 col-md-10 col-sm-10"> 600 <div class="panel-head" style="height:auto; padding: 5px;"> 601 <h3 class="list-title" style="text-align:left;font-size:16px"><span style="filter: blur(4px);-ms-filter: blur(4px);">Lesson 11ãã»ã¬ã¯ã¿ã</span></h3><p class="comment" style="font-size:0.8rem; padding:10px;text-align:left; min-height:60px;"><span style="filter: blur(4px);-ms-filter: blur(4px);">CSSè¨èªã§ã®è¦ç´ ã¸ã®ã¹ã¿ã¤ã«æå®æ¹æ³ã¨ã¹ã¿ã¤ã«æå®ã被ã£ãå ´åã®ã¹ã¿ã¤ã«ãé©ç¨ãããåªå é ä½ãå¦ç¿ãã¦ããã¾ãã</span></p> </div> 602 </div><div class="col-lg-2 col-md-2 col-sm-2"> 603 <div class="panel-body img-liquid list-img" style="display:block;"><label class="label label-warning fl-right" style="border-radius:0; margin:0;">ãã¬ãã¢ã </label><img src="http://i.ytimg.com/vi/0.jpg" alt="" /></div> 604 </div></div> 605 </div> <div class="col-lg-12 table-option ctn2-list-container pt10 pb10" style="border-bottom:1px solid #ccc;position: relative;"> 606 <p style="position: absolute;left: calc(50% - 120px);top: calc(50% - 10px);z-index: 3;font-size: 1em;font-weight:bold;color:#666;text-shadow: 0 0 10px #fff"> 607 次ã®ç·´ç¿ã¸é²ã ãã¿ã³ã§è§£é¤ 608 </p> 609 <i class="fa fa-lock" style="position: absolute;left: calc(50% - 35px);top: calc(50% - 28px);z-index: 1;font-size: 3.5em;opacity: .7;"></i> 610 <div class="ctn panel panel-naked mb20 ctn2-list-mini"> 611 <div class="col-lg-10 col-md-10 col-sm-10"> 612 <div class="panel-head" style="height:auto; padding: 5px;"> 613 <h3 class="list-title" style="text-align:left;font-size:16px"><span style="filter: blur(4px);-ms-filter: blur(4px);">Lesson 12ããããã¯ã¬ãã«è¦ç´ ã¨ã¤ã³ã©ã¤ã³è¦ç´ ã</span></h3><p class="comment" style="font-size:0.8rem; padding:10px;text-align:left; min-height:60px;"><span style="filter: blur(4px);-ms-filter: blur(4px);">CSSã§ãã¼ã ãã¼ã¸ãã¬ã¤ã¢ã¦ããã¦ããéã«å¿ é ã®ç¥èã¨ãªãè¦ç´ ã®ç¨®é¡ã«ã¤ãã¦å¦ç¿ãã¦ããã¾ãã</span></p> </div> 614 </div><div class="col-lg-2 col-md-2 col-sm-2"> 615 <div class="panel-body img-liquid list-img" style="display:block;"><label class="label label-warning fl-right" style="border-radius:0; margin:0;">ãã¬ãã¢ã </label><img src="http://i.ytimg.com/vi/0.jpg" alt="" /></div> 616 </div></div> 617 </div> <div class="col-lg-12 table-option ctn2-list-container pt10 pb10" style="border-bottom:1px solid #ccc;position: relative;"> 618 <p style="position: absolute;left: calc(50% - 120px);top: calc(50% - 10px);z-index: 3;font-size: 1em;font-weight:bold;color:#666;text-shadow: 0 0 10px #fff"> 619 次ã®ç·´ç¿ã¸é²ã ãã¿ã³ã§è§£é¤ 620 </p> 621 <i class="fa fa-lock" style="position: absolute;left: calc(50% - 35px);top: calc(50% - 28px);z-index: 1;font-size: 3.5em;opacity: .7;"></i> 622 <div class="ctn panel panel-naked mb20 ctn2-list-mini"> 623 <div class="col-lg-10 col-md-10 col-sm-10"> 624 <div class="panel-head" style="height:auto; padding: 5px;"> 625 <h3 class="list-title" style="text-align:left;font-size:16px"><span style="filter: blur(4px);-ms-filter: blur(4px);">Lesson 13ãmarginã¨paddingã</span></h3><p class="comment" style="font-size:0.8rem; padding:10px;text-align:left; min-height:60px;"><span style="filter: blur(4px);-ms-filter: blur(4px);">
625ãã¼ã ãã¼ã¸ã®ã¬ã¤ã¢ã¦ããçµãã§ããéã«éè¦ãªãä½ç½ãã«ã¤ãã¦å¦ãã§ããã¾ãã</span></p> </div> 626 </div><div class="col-lg-2 col-md-2 col-sm-2"> 627 <div class="panel-body img-liquid list-img" style="display:block;"><label class="label label-warning fl-right" style="border-radius:0; margin:0;">ãã¬ãã¢ã </label><img src="http://i.ytimg.com/vi/0.jpg" alt="" /></div> 628 </div></div> 629 </div> <div class="col-lg-12 table-option ctn2-list-container pt10 pb10" style="border-bottom:1px solid #ccc;position: relative;"> 630 <p style="position: absolute;left: calc(50% - 120px);top: calc(50% - 10px);z-index: 3;font-size: 1em;font-weight:bold;color:#666;text-shadow: 0 0 10px #fff"> 631 次ã®ç·´ç¿ã¸é²ã ãã¿ã³ã§è§£é¤ 632 </p> 633 <i class="fa fa-lock" style="position: absolute;left: calc(50% - 35px);top: calc(50% - 28px);z-index: 1;font-size: 3.5em;opacity: .7;"></i> 634 <div class="ctn panel panel-naked mb20 ctn2-list-mini"> 635 <div class="col-lg-10 col-md-10 col-sm-10"> 636 <div class="panel-head" style="height:auto; padding: 5px;"> 637 <h3 class="list-title" style="text-align:left;font-size:16px"><span style="filter: blur(4px);-ms-filter: blur(4px);">Lesson 14ãåä½ã®æå®ã</span></h3><p class="comment" style="font-size:0.8rem; padding:10px;text-align:left; min-height:60px;"><span style="filter: blur(4px);-ms-filter: blur(4px);">CSSã§æå®ã§ããã大ããã®åä½ãã¨ãè²ã®åä½ãã«ã¤ãã¦å¦ãã§ããã¾ãï¼</span></p> </div> 638 </div><div class="col-lg-2 col-md-2 col-sm-2"> 639 <div class="panel-body img-liquid list-img" style="display:block;"><label class="label label-warning fl-right" style="border-radius:0; margin:0;">ãã¬ãã¢ã </label><img src="http://i.ytimg.com/vi/0.jpg" alt="" /></div> 640 </div></div> 641 </div> <div class="col-lg-12 table-option ctn2-list-container pt10 pb10" style="border-bottom:1px solid #ccc;position: relative;"> 642 <p style="position: absolute;left: calc(50% - 120px);top: calc(50% - 10px);z-index: 3;font-size: 1em;font-weight:bold;color:#666;text-shadow: 0 0 10px #fff"> 643 次ã®ç·´ç¿ã¸é²ã ãã¿ã³ã§è§£é¤ 644 </p> 645 <i class="fa fa-lock" style="position: absolute;left: calc(50% - 35px);top: calc(50% - 28px);z-index: 1;font-size: 3.5em;opacity: .7;"></i> 646 <div class="ctn panel panel-naked mb20 ctn2-list-mini"> 647 <div class="col-lg-10 col-md-10 col-sm-10"> 648 <div class="panel-head" style="height:auto; padding: 5px;"> 649 <h3 class="list-title" style="text-align:left;font-size:16px"><span style="filter: blur(4px);-ms-filter: blur(4px);">ã³ã¼ãã¼ãã¬ã¤ã¯ãããã°ã©ãã³ã°ã§ç¨¼ãã¨ã¯ã©ããããã¨ãªã®ãï¼ã</span></h3> </div> 650 </div><div class="col-lg-2 col-md-2 col-sm-2"> 651 <div class="panel-body img-liquid list-img" style="display:block;"><label class="label label-warning fl-right" style="border-radius:0; margin:0;">ãã¬ãã¢ã </label><img src="http://i.ytimg.com/vi/0.jpg" alt="" /></div> 652 </div></div> 653 </div> <div class="col-lg-12 table-option ctn2-list-container pt10 pb10" style="border-bottom:1px solid #ccc;position: relative;"> 654 <p style="position: absolute;left: calc(50% - 120px);top: calc(50% - 10px);z-index: 3;font-size: 1em;font-weight:bold;color:#666;text-shadow: 0 0 10px #fff"> 655 次ã®ç·´ç¿ã¸é²ã ãã¿ã³ã§è§£é¤ 656 </p> 657 <i class="fa fa-lock" style="position: absolute;left: calc(50% - 35px);top: calc(50% - 28px);z-index: 1;font-size: 3.5em;opacity: .7;"></i> 658 <div class="ctn panel panel-naked mb20 ctn2-list-mini"> 659 <div class="col-lg-10 col-md-10 col-sm-10"> 660 <div class="panel-head" style="height:auto; padding: 5px;"> 661 <h3 class="list-title" style="text-align:left;font-size:16px"><span style="filter: blur(4px);-ms-filter: blur(4px);">Lesson 15ãpositionã¨floatã</span></h3><p class="comment" style="font-size:0.8rem; padding:10px;text-align:left; min-height:60px;"><span style="filter: blur(4px);-ms-filter: blur(4px);">CSSã§ããã¯ã¹ã®é ç½®ãæå®ã§ãããpositionããfloatããå¦ãã§ããã¾ãï¼</span></p> </div> 662 </div><div class="col-lg-2 col-md-2 col-sm-2"> 663 <div class="panel-body img-liquid list-img" style="display:block;"><label class="label label-warning fl-right" style="border-radius:0; margin:0;">ãã¬ãã¢ã </label><img src="http://i.ytimg.com/vi/0.jpg" alt="" /></div> 664 </div></div> 665 </div> <div class="col-lg-12 table-option ctn2-list-container pt10 pb10" style="border-bottom:1px solid #ccc;position: relative;"> 666 <p style="position: absolute;
666left: calc(50% - 120px);top: calc(50% - 10px);z-index: 3;font-size: 1em;font-weight:bold;color:#666;text-shadow: 0 0 10px #fff"> 667 次ã®ç·´ç¿ã¸é²ã ãã¿ã³ã§è§£é¤ 668 </p> 669 <i class="fa fa-lock" style="position: absolute;left: calc(50% - 35px);top: calc(50% - 28px);z-index: 1;font-size: 3.5em;opacity: .7;"></i> 670 <div class="ctn panel panel-naked mb20 ctn2-list-mini"> 671 <div class="col-lg-10 col-md-10 col-sm-10"> 672 <div class="panel-head" style="height:auto; padding: 5px;"> 673 <h3 class="list-title" style="text-align:left;font-size:16px"><span style="filter: blur(4px);-ms-filter: blur(4px);">ã³ã¼ãã¼ãã¬ã¤ã¯ãé«ãã®ï¼å®ãã®ï¼åºæ¥ãã®ï¼åºæ¥ãªãã®ï¼ã</span></h3> </div> 674 </div><div class="col-lg-2 col-md-2 col-sm-2"> 675 <div class="panel-body img-liquid list-img" style="display:block;"><label class="label label-warning fl-right" style="border-radius:0; margin:0;">ãã¬ãã¢ã </label><img src="http://i.ytimg.com/vi/0.jpg" alt="" /></div> 676 </div></div> 677 </div> <div class="col-lg-12 table-option ctn2-list-container pt10 pb10" style="border-bottom:1px solid #ccc;position: relative;"> 678 <p style="position: absolute;left: calc(50% - 120px);top: calc(50% - 10px);z-index: 3;font-size: 1em;font-weight:bold;color:#666;text-shadow: 0 0 10px #fff"> 679 次ã®ç·´ç¿ã¸é²ã ãã¿ã³ã§è§£é¤ 680 </p> 681 <i class="fa fa-lock" style="position: absolute;left: calc(50% - 35px);top: calc(50% - 28px);z-index: 1;font-size: 3.5em;opacity: .7;"></i> 682 <div class="ctn panel panel-naked mb20 ctn2-list-mini"> 683 <div class="col-lg-10 col-md-10 col-sm-10"> 684 <div class="panel-head" style="height:auto; padding: 5px;"> 685 <h3 class="list-title" style="text-align:left;font-size:16px"><span style="filter: blur(4px);-ms-filter: blur(4px);">Lesson 16ãå®éã«HPãä½ã£ã¦ã¿ããï¼partï¼ã</span></h3><p class="comment" style="font-size:0.8rem; padding:10px;text-align:left; min-height:60px;"><span style="filter: blur(4px);-ms-filter: blur(4px);">ä»ã¾ã§ã®é大æï¼ããããã¼ã¸ã¨ãååããã¼ã¸ãå®éã«ä½ã£ã¦ããã¾ãããï¼ä»åã¯HTMLã§ããããã¼ã¸ãä½ã£ã¦ããã¾ãã 686ããã¹ãã¨ãã£ã¿ãä»ã¾ã§ããåªãããAtomãã使ã£ã¦ããã¾ãã</span></p> </div> 687 </div><div class="col-lg-2 col-md-2 col-sm-2"> 688 <div class="panel-body img-liquid list-img" style="display:block;"><label class="label label-warning fl-right" style="border-radius:0; margin:0;">ãã¬ãã¢ã </label><img src="http://i.ytimg.com/vi/0.jpg" alt="" /></div> 689 </div></div> 690 </div> <div class="col-lg-12 table-option ctn2-list-container pt10 pb10" style="border-bottom:1px solid #ccc;position: relative;"> 691 <p style="position: absolute;left: calc(50% - 120px);top: calc(50% - 10px);z-index: 3;font-size: 1em;font-weight:bold;color:#666;text-shadow: 0 0 10px #fff"> 692 次ã®ç·´ç¿ã¸é²ã ãã¿ã³ã§è§£é¤ 693 </p> 694 <i class="fa fa-lock" style="position: absolute;left: calc(50% - 35px);top: calc(50% - 28px);z-index: 1;font-size: 3.5em;opacity: .7;"></i> 695 <div class="ctn panel panel-naked mb20 ctn2-list-mini"> 696 <div class="col-lg-10 col-md-10 col-sm-10"> 697 <div class="panel-head" style="height:auto; padding: 5px;"> 698 <h3 class="list-title" style="text-align:left;font-size:16px"><span style="filter: blur(4px);-ms-filter: blur(4px);">Lesson 17ãå®éã«HPãä½ã£ã¦ã¿ããï¼partï¼ã</span></h3><p class="comment" style="font-size:0.8rem; padding:10px;text-align:left; min-height:60px;"><span style="filter: blur(4px);-ms-filter: blur(4px);">ä»åã¯ãåãåãããã©ã¼ã ã®ä½æã¨ããããCSSã使ã£ã¦è¦ãç®ãæ´ãã¦ããã¾ãã 699æ°ãã«å¦ã¶ãã®ï¼GoogleChromeã®éçºãã¼ã«ã®ä½¿ãæ¹ãplaceholder屿§ããã©ã³ããã¡ããªã¼ï¼ãã©ã³ã種é¡ï¼ã®å¤æ´ãGoogleã¦ã§ããã©ã³ãã®ä½¿ãæ¹ãæåã®ä¸ä¸ä¸å¤®æã</span></p> </div> 700 </div><div class="col-lg-2 col-md-2 col-sm-2"> 701 <div class="panel-body img-liquid list-img" style="display:block;"><label class="label label-warning fl-right" style="border-radius:0; margin:0;">ãã¬ãã¢ã </label><img src="http://i.ytimg.com/vi/0.jpg" alt="" /></div> 702 </div></div> 703 </div> <div class="col-lg-12 table-option ctn2-list-container pt10 pb10" style="border-bottom:1px solid #ccc;position: relative;"> 704 <p style="position: absolute;
704left: calc(50% - 120px);top: calc(50% - 10px);z-index: 3;font-size: 1em;font-weight:bold;color:#666;text-shadow: 0 0 10px #fff"> 705 次ã®ç·´ç¿ã¸é²ã ãã¿ã³ã§è§£é¤ 706 </p> 707 <i class="fa fa-lock" style="position: absolute;left: calc(50% - 35px);top: calc(50% - 28px);z-index: 1;font-size: 3.5em;opacity: .7;"></i> 708 <div class="ctn panel panel-naked mb20 ctn2-list-mini"> 709 <div class="col-lg-10 col-md-10 col-sm-10"> 710 <div class="panel-head" style="height:auto; padding: 5px;"> 711 <h3 class="list-title" style="text-align:left;font-size:16px"><span style="filter: blur(4px);-ms-filter: blur(4px);">Lesson18ãå®éã«HPãä½ã£ã¦ã¿ããï¼part3ã</span></h3><p class="comment" style="font-size:0.8rem; padding:10px;text-align:left; min-height:60px;"><span style="filter: blur(4px);-ms-filter: blur(4px);">ã¨ãã¨ããããããã¼ã¸ã宿ãã¾ãï¼ããã¯ã¹ã®ä¸å¤®å¯ãããããã¯ã¹ã®ç¸¦å¹ ã®æãæ¹ãmarginã®ç¸æ®ºãpaddingãborderãããã¯ã¹ã®å¹ ã«å«ããæ¹æ³ãªã©å®è·µçã«ä½¿ããå 容ãå¦ãã§ããã¾ãã 712</span></p> </div> 713 </div><div class="col-lg-2 col-md-2 col-sm-2"> 714 <div class="panel-body img-liquid list-img" style="display:block;"><label class="label label-warning fl-right" style="border-radius:0; margin:0;">ãã¬ãã¢ã </label><img src="http://i.ytimg.com/vi/0.jpg" alt="" /></div> 715 </div></div> 716 </div> <div class="col-lg-12 table-option ctn2-list-container pt10 pb10" style="border-bottom:1px solid #ccc;position: relative;"> 717 <p style="position: absolute;left: calc(50% - 120px);top: calc(50% - 10px);z-index: 3;font-size: 1em;font-weight:bold;color:#666;text-shadow: 0 0 10px #fff"> 718 次ã®ç·´ç¿ã¸é²ã ãã¿ã³ã§è§£é¤ 719 </p> 720 <i class="fa fa-lock" style="position: absolute;left: calc(50% - 35px);top: calc(50% - 28px);z-index: 1;font-size: 3.5em;opacity: .7;"></i> 721 <div class="ctn panel panel-naked mb20 ctn2-list-mini"> 722 <div class="col-lg-10 col-md-10 col-sm-10"> 723 <div class="panel-head" style="height:auto; padding: 5px;"> 724 <h3 class="list-title" style="text-align:left;font-size:16px"><span style="filter: blur(4px);-ms-filter: blur(4px);">Lesson19ãå®éã«HPãä½ã£ã¦ã¿ããï¼part4ã</span></h3><p class="comment" style="font-size:0.8rem; padding:10px;text-align:left; min-height:60px;"><span style="filter: blur(4px);-ms-filter: blur(4px);">ã¨ãã¨ãæçµåï¼ãåãåãããã©ã¼ã ã®ã¹ã¿ã¤ã«ãä½ã£ã¦å®æã§ãï¼</span></p> </div> 725 </div><div class="col-lg-2 col-md-2 col-sm-2"> 726 <div class="panel-body img-liquid list-img" style="display:block;"><label class="label label-warning fl-right" style="border-radius:0; margin:0;">ãã¬ãã¢ã </label><img src="http://i.ytimg.com/vi/0.jpg" alt="" /></div> 727 </div></div> 728 </div> <div class="col-lg-12 table-option ctn2-list-container pt10 pb10" style="border-bottom:1px solid #ccc;position: relative;"> 729 <p style="position: absolute;left: calc(50% - 120px);top: calc(50% - 10px);z-index: 3;font-size: 1em;font-weight:bold;color:#666;text-shadow: 0 0 10px #fff"> 730 次ã®ç·´ç¿ã¸é²ã ãã¿ã³ã§è§£é¤ 731 </p> 732 <i class="fa fa-lock" style="position: absolute;left: calc(50% - 35px);top: calc(50% - 28px);z-index: 1;font-size: 3.5em;opacity: .7;"></i> 733 <div class="ctn panel panel-naked mb20 ctn2-list-mini"> 734 <div class="col-lg-10 col-md-10 col-sm-10"> 735 <div class="panel-head" style="height:auto; padding: 5px;"> 736 <h3 class="list-title" style="text-align:left;font-size:16px"><span style="filter: blur(4px);-ms-filter: blur(4px);">ã³ã¼ãã¼ãã¬ã¤ã¯ãã¯ãããããã°ã©ãã³ã° 第2話ã</span></h3> </div> 737 </div><div class="col-lg-2 col-md-2 col-sm-2"> 738 <div class="panel-body img-liquid list-img" style="display:block;"><label class="label label-warning fl-right" style="border-radius:0; margin:0;">ãã¬ãã¢ã </label><img src="http://i.ytimg.com/vi/0.jpg" alt="" /></div> 739 </div></div> 740 </div> </div> 741 </div> 742 743 </div> 744 745 </div> 746 </div><!-- End åºæ¬æ å ± --> 747 748 </div><!-- end .col --> 749 750 <!-- Sidebar --> 751 <div class="col-lg-3 col-md-3 col-sm-3 sidebar" style="padding:15px;"> 752 753 <!-- 飿³é åã®æåã®ãã¼ãåå¾ --> 754 755 756 757 758 759 760 761<!-- <div class="baner baner-side"> 762 <a href="http://crazy-wp.com"><img class="img-responsive" src="https://webukatu.com/assets/img//baner/ad-baner02.png?1575572579" alt="" /></a> 763</div> 764<div class="baner baner-side"> 765 <a href="http://0-1-llc.com"><img class="img-responsive" src="https://webukatu.com/assets/img//baner/ad-baner1.png?1575572579" alt="" /></a> 766</div> 767 --> 768 769<!-- 770 --> 771 772<section class="fl-right sidebar-opinion-margin"> 773 <h2 class="sidebar-beneath-title"><p>ãæè¦ç®±</p></h2> 774 <form method="post" enctype="multipart/form-data"> 775 <textarea cols="50" rows="5" placeholder="" style="height:148px; width:100%; padding:5px; line-height:1rem; margin-bottom: 18px; border:2px solid #f6f6f6" id="iken-area"></textarea><br /> 776 <p style="color:#545454; line-height:1.5em;" class="sidebar-beneath-note">â»ãã¡ãã®ãã©ã¼ã ã§éä¿¡ãããå 容ã¯ã¦ã¼ã¶ã¼ã®ç¹å®ããè¿ä¿¡ãã§ãã¾ããã<br />è¿ä¿¡å¸æã®å ´åã¯ããµã¤ãä¸é¨ã«ããããååãããããé£çµ¡ãã ããã</p> 777 <div class="btn-block mt10"> 778 <p class="btn btn-primary btn-midium sidebar-beneath-submit" id="send-iken" style="width:100%; border-radius:3px !important;">éä¿¡ãã</p> 779 </div> 780 </form> 781</section> 782 783 784 785<!-- Twitter --> 786<!-- 787<div class="panel panel-naked panel-twitter" style="margin-top:0;"> 788 <div class="panel-header"> 789 <h1>Twitter</h1> 790 </div> 791 <div class="panel-body"> 792
793 <a class="twitter-timeline" href="https://twitter.com/fuzooku" data-widget-id="554737138923630592">@fuzookuããã®ãã¤ã¼ã</a>
794<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
794 795 796 797 </div> 798</div> 799--> 800 801<!-- 802<div class="panel panel-naked panel-custom2" style="margin-top:0;"> 803 <div class="panel-header"> 804 <h1>ãªã¹ã¹ã¡é¢¨ä¿åº</h1> 805 </div> 806 <div class="panel-body"> 807 808 <a href="" class="row list-mini"> 809 <div class="col-lg-4 col-md-4 col-sm-4 col-xs-5 img-container"> 810 <div class="img-liquid" style="height:60px; width:100%;"> 811 <img class="img-responsive" alt="" /> </div> 812 </div> 813 <div class="col-lg-8 col-md-8 col-sm-8 col-xs-7"> 814 <p>颿±æå¤§åºä¼ãã«ãã§ããã£ã³ã«ãã§å·å´åº</p> 815 </div> 816 </a> 817 818 <a href="" class="row list-mini"> 819 <div class="col-lg-4 col-md-4 col-sm-4 col-xs-5 img-container"> 820 <div class="img-liquid" style="height:60px; width:100%;"> 821 <img class="img-responsive" alt="" /> </div> 822 </div> 823 <div class="col-lg-8 col-md-8 col-sm-8 col-xs-7"> 824 825 <p>ç´å¥³ãã¼ãª</p> 826 827 </div> 828 </a> 829 830 <a href="" class="row list-mini"> 831 <div class="col-lg-4 col-md-4 col-sm-4 col-xs-5 img-container"> 832 <div class="img-liquid" style="height:60px; width:100%;"> 833 <img class="img-responsive" alt="" /> </div> 834 </div> 835 <div class="col-lg-8 col-md-8 col-sm-8 col-xs-7"> 836 837 <p>Romeo 2nd Impact</p> 838 839 </div> 840 </a> 841 842 <a href="" class="row list-mini"> 843 <div class="col-lg-4 col-md-4 col-sm-4 col-xs-5 img-container"> 844 <div class="img-liquid" style="height:60px; width:100%;"> 845 <img class="img-responsive" alt="" /> </div> 846 </div> 847 <div class="col-lg-8 col-md-8 col-sm-8 col-xs-7"> 848 849 <p>æ¸è°·Mæ§æãC.C.Cats </p> 850 851 </div> 852 </a> 853 854 <a href="" class="row list-mini"> 855 <div class="col-lg-4 col-md-4 col-sm-4 col-xs-5 img-container"> 856 <div class="img-liquid" style="height:60px; width:100%;"> 857 <img class="img-responsive" alt="" /> </div> 858 </div> 859 <div class="col-lg-8 col-md-8 col-sm-8 col-xs-7"> 860 861 <p>20代ç¾äººå¦»ãããã夿 ãµã¼ã¯ã«ãããªãã«SCANDAL</p> 862 863 </div> 864 </a> 865 866 </div> 867</div> 868 --> 869 870<!--ãã¹ã2--> 871 </div> 872 <!-- End Sidebar --> 873 874 </section> 875 </div> 876 <!-- End #main --> </div> 877 </div><!-- end #page --> 878 879<!-- ============================================== 880 ã¡ãã»ã¼ã¸è¡¨ç¤º 881=============================================== --> 882<div id="msg-area" style="display:none;"> 883 <p class="" style="vertical-align: middle"></p> 884</div> 885 886<!-- ============================================== 887Footer 888=============================================== --> 889 890 891 892 893<!--ãªãã¥ã¼ã¢ã«åã®ããã¿ã¼--> 894<div class="row" style="background: #f6f5f4; padding: 15px"> 895 <div class="col-lg-2"> 896 897 <ul style="display: flex; justify-items: center"> 898 899 <li><a 900 href="https://webukatu.com/search/contents1_detail_info?c1id=35150">HTMLã»CSSé¨ å ¥é</a> 901 </li> 902 903 </ul> 904 </div> 905 <div class="col-lg-2"> 906 907 <ul style="display: flex; justify-items: center"> 908 909 <li><a 910 href="https://webukatu.com/search/contents1_detail_info?c1id=35151">javascriptã»jQueryé¨ å ¥é</a> 911 </li> 912 913 </ul> 914 </div> 915 <div class="col-lg-2"> 916 917 <ul style="display: flex; justify-items: center"> 918 919 <li><a 920 href="https://webukatu.com/search/contents1_detail_info?c1id=35152">PHPã»MySQLé¨</a> 921 </li> 922 923 </ul> 924 </div> 925 <div class="col-lg-2"> 926 927 <ul style="display: flex; justify-items: center"> 928 929 <li><a 930 href="https://webukatu.com/search/contents1_detail_info?c1id=35153">ãããã¯ã¼ã¯ã»ãµã¼ãã¼é¨</a> 931 </li> 932 933 </ul> 934 </div> 935 <div class="col-lg-2"> 936 937 <ul style="display: flex; justify-items: center"> 938 939 <li><a 940 href="https://webukatu.com/search/contents1_detail_info?c1id=35155">WEBãµã¼ãã¹é¨</a> 941 </li> 942 943 </ul> 944 </div> 945 <div class="col-lg-2"> 946 947 <ul style="display: flex; justify-items: center"> 948 949 <li><a 950 href="https://webukatu.com/search/contents1_detail_info?c1id=35157">
950PHPãªãã¸ã§ã¯ãæåé¨</a> 951 </li> 952 953 </ul> 954 </div> 955 <div class="col-lg-2"> 956 957 <ul style="display: flex; justify-items: center"> 958 959 <li><a 960 href="https://webukatu.com/search/contents1_detail_info?c1id=35154">WordPressé¨</a> 961 </li> 962 963 </ul> 964 </div> 965 <div class="col-lg-2"> 966 967 <ul style="display: flex; justify-items: center"> 968 969 <li><a 970 href="https://webukatu.com/search/contents1_detail_info?c1id=35156">javascriptã»jQueryé¨ ä¸ç´</a> 971 </li> 972 973 </ul> 974 </div> 975 <div class="col-lg-2"> 976 977 <ul style="display: flex; justify-items: center"> 978 979 <li><a 980 href="https://webukatu.com/search/contents1_detail_info?c1id=35162">HTMLã»CSSé¨ ä¸ç´</a> 981 </li> 982 983 </ul> 984 </div> 985 <div class="col-lg-2"> 986 987 <ul style="display: flex; justify-items: center"> 988 989 <li><a 990 href="https://webukatu.com/search/contents1_detail_info?c1id=35165">HTMLã»CSSé¨ ä¸ç´</a> 991 </li> 992 993 </ul> 994 </div> 995 <div class="col-lg-2"> 996 997 <ul style="display: flex; justify-items: center"> 998 999 <li><a 1000 href="https://webukatu.com/search/contents1_detail_info?c1id=35158">PHPãã¬ã¼ã ã¯ã¼ã¯é¨</a> 1001 </li> 1002 1003 </ul> 1004 </div> 1005 <div class="col-lg-2"> 1006 1007 <ul style="display: flex; justify-items: center"> 1008 1009 <li><a 1010 href="https://webukatu.com/search/contents1_detail_info?c1id=35164">javascriptã»jQueryé¨ ä¸ç´</a> 1011 </li> 1012 1013 </ul> 1014 </div> 1015 <div class="col-lg-2"> 1016 1017 <ul style="display: flex; justify-items: center"> 1018 1019 <li><a 1020 href="https://webukatu.com/search/contents1_detail_info?c1id=35167">Laravelé¨</a> 1021 </li> 1022 1023 </ul> 1024 </div> 1025 <div class="col-lg-2"> 1026 1027 <ul style="display: flex; justify-items: center"> 1028 1029 <li><a 1030 href="https://webukatu.com/search/contents1_detail_info?c1id=35160">WEBãã¼ã±ãã£ã³ã°é¨</a> 1031 </li> 1032 1033 </ul> 1034 </div> 1035 <div class="col-lg-2"> 1036 1037 <ul style="display: flex; justify-items: center"> 1038 1039 <li><a 1040 href="https://webukatu.com/search/contents1_detail_info?c1id=35172">æ³åé¨</a> 1041 </li> 1042 1043 </ul> 1044 </div> 1045 <div class="col-lg-2"> 1046 1047 <ul style="display: flex; justify-items: center"> 1048 1049 <li><a 1050 href="https://webukatu.com/search/contents1_detail_info?c1id=35163">å¶æ¥é¨</a> 1051 </li> 1052 1053 </ul> 1054 </div> 1055 <div class="col-lg-2"> 1056 1057 <ul style="display: flex; justify-items: center"> 1058 1059 <li><a 1060 href="https://webukatu.com/search/contents1_detail_info?c1id=35159">èµ·æ¥é¨</a> 1061 </li> 1062 1063 </ul> 1064 </div> 1065 <div class="col-lg-2"> 1066 1067 <ul style="display: flex; justify-items: center"> 1068 1069 <li><a 1070 href="https://webukatu.com/search/contents1_detail_info?c1id=35161">ä¿éºé¨ï¼24æéå ¥é¨éå®ç¹å ¸ï¼</a> 1071 </li> 1072 1073 </ul> 1074 </div> 1075 <div class="col-lg-2"> 1076 1077 <ul style="display: flex; justify-items: center"> 1078 1079 <li><a 1080 href="https://webukatu.com/search/contents1_detail_info?c1id=35166">Ruby on Railsé¨ï¼24æéå ¥é¨éå®ç¹å ¸ï¼</a> 1081 </li> 1082 1083 </ul> 1084 </div> 1085 <div class="col-lg-2"> 1086 1087 <ul style="display: flex; justify-items: center"> 1088 1089 <li><a 1090 href="https://webukatu.com/search/contents1_detail_info?c1id=35168">ãã¹ãé¨</a> 1091 </li> 1092 1093 </ul> 1094 </div> 1095 <div class="col-lg-2"> 1096 1097 <ul style="display: flex; justify-items: center"> 1098 1099 <li><a 1100 href="https://webukatu.com/search/contents1_detail_info?c1id=35169">Javaé¨ï¼24æéå ¥é¨éå®ç¹å ¸ï¼</a> 1101 </li> 1102 1103 </ul> 1104 </div> 1105 <div class="col-lg-2"> 1106 1107 <ul style="display: flex; justify-items: center"> 1108 1109 <li><a 1110 href="https://webukatu.com/search/contents1_detail_info?c1id=35171">AWSã¤ã³ãã©é¨ï¼24æéå ¥é¨éå®ç¹å ¸ï¼</a> 1111 </li> 1112 1113 </ul> 1114 </div> 1115 <div class="col-lg-2"> 1116 1117 <ul style="display: flex; justify-items: center"> 1118 1119 <li><a 1120 href="https://webukatu.com/search/contents1_detail_info?c1id=35175">ã試ãã¬ãã¹ã³ã1æéåã§ãããããªãããã£ã¼ã«HPãä½ããï¼ã</a> 1121 </li> 1122 1123 </ul> 1124 </div> 1125 <div class="col-lg-2"> 1126 1127 <ul style="display: flex; justify-items: center"> 1128 1129 <li><a 1130 href="https://webukatu.com/search/contents1_detail_info?c1id=35176">ãªãªã¨ã³ãã¼ã·ã§ã³</a> 1131 </li> 1132 1133 </ul> 1134 </div> 1135 <div class="col-lg-2"> 1136 1137 <ul style="display: flex; justify-items: center"> 1138 1139 <li><a 1140 href="https://webukatu.com/search/contents1_detail_info?c1id=35177">WEBãã¶ã¤ã³é¨ï¼24æéå ¥é¨éå®ç¹å ¸ï¼</a> 1141 </li> 1142 1143 </ul> 1144 </div> 1145 </div> 1146<div class="row footer bg-porygon-black" id="footer" style="margin:0;"> 1147 <footer> 1148 <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12"> 1149 <section> 1150 <div id="top-logo" class="ft-family1"> 1151 <a href="https://webukatu.com/home"> 1152 <img id="logo" alt="" /> </a> 1153 </div> 1154 </section> 1155 </div> 1156 <div class="col-lg-8 col-md-8 col-sm-8 col-xs-12"> 1157 <section class="t-right"> 1158 <a href="https://webukatu.com/home/agreement">å©ç¨è¦ç´</a> | <a 1159 href="https://webukatu.com/home/policy">ãã©ã¤ãã·ã¼ããªã·ã¼</a> | <a 1160 href="https://webukatu.com/home/tokutei">ç¹å®åå弿³ã«åºã¥ã表è¨</a> 1161 | <a href="https://webukatu.com/home/contact">ãååã</a> 1162 <br/> 1163 1164 </section> 1165 1166 </div><!-- end .col --> 1167 <p class="copyright">
1167Copyright © <a href="http://0-1-llc.com/" target="_blank" rel="noopener">ã¼ãã¯ã³LLC</a>. 1168 All Rights Reserved. 1169 </p> 1170 </footer> 1171 </div><!-- end .row --> 1172 1173<a id="pageTop" href="#contents"><i class="fa fa-angle-double-up"></i></a> 1174 1175<!-- ============================================== 1176JavaScript 1177=============================================== --> 1178<!-- jquery -->
1179<script src="https://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
vendor: 1 bytes, line 1179
1179
1180<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>
1180 1181 1182<!-- jqueryãèªã¿è¾¼ã¾ããªãã£ãå ´åã«ãã¡ã¤ã«ããèªã¿è¾¼ã -->
1183<script> 1184 window.jQuery || document.write('
1184<script src="/js/jquery-2.1.1.min.js">\x3C/script>') 1185 1186</script>
1186 1187 1188<!-- slickèªè¾¼ã¿ -->
1189<script type="text/javascript" src="//cdn.jsdelivr.net/npm/[email protected]/slick/slick.min.js"></script>
1189 1190 1191<!-- BootStrapèªè¾¼ã¿ --> 1192
1192<script type="text/javascript" src="https://webukatu.com/assets/js/bootstrap.min.js?1575572580"></script>
1192 1193 1194<!-- ããã¿ã¼ãã¦ã£ã³ãã¦ä¸é¨ã¸åºå®ããjsãèªè¾¼ã¿ --> 1195
1195<script type="text/javascript" src="https://webukatu.com/assets/js/footerFixed.js?1575572580"></script>
1195 1196 1197<!-- ç»åã¹ã©ã¤ãã¼ --> 1198
1198<script type="text/javascript" src="https://webukatu.com/assets/js/jquery.flexslider-min.js?1575572580"></script>
1198 1199 1200<!-- DateTimePicker --> 1201
1201<script type="text/javascript" src="https://webukatu.com/assets/js/jquery.datetimepicker.js?1575572580"></script>
1201 1202 1203<!-- ã¹ã¯ãã¼ã«è¡¨ç¤º --> 1204
1204<script type="text/javascript" src="https://webukatu.com/assets/js/jquery.scrollFade.js?1575572580"></script>
1204 1205 1206<!-- ãã©ã¼ã è£ é£¾ãicheck.js --> 1207
1207<script type="text/javascript" src="https://webukatu.com/assets/js/icheck.min.js?1575572580"></script>
1207 1208 1209<!-- 使èªåå ¥åãã©ã°ã¤ã³ --> 1210<!--
1210<script src="//jpostal.googlecode.com/svn/trunk/jquery.jpostal.js" type="text/javascript"></script>
1210 --> 1211 1212<!-- ç»åèªåãªãµã¤ãº --> 1213
1213<script type="text/javascript" src="https://webukatu.com/assets/js/imgLiquid-min.js?1575572580"></script>
1213 1214 1215<!-- TimePicker --> 1216
1216<script type="text/javascript" src="https://webukatu.com/assets/js/bootstrap-timepicker.min.js?1575572580"></script>
1216 1217 1218<!-- ã¤ã³ã¸ã±ã¼ã¿ã¼ --> 1219
1219<script type="text/javascript" src="https://webukatu.com/assets/js/radialIndicator.min.js?1575572580"></script>
1219 1220 1221<!-- ãããã¼èªåé表示 --> 1222 1223<!-- CDN -->
1224<script src="https://cdnjs.cloudflare.com/ajax/libs/velocity/1.2.3/velocity.js"></script>
1224 1225 1226<!-- Plugins --> 1227
1227<script type="text/javascript" src="https://webukatu.com/assets/js/plugins/fadeInAnimatePlugin.js?1598162752"></script>
1227 1228
1228<script type="text/javascript" src="https://webukatu.com/assets/js/plugins/mouseOverAnimatePlugin.js?1575572580"></script>
1228 1229
1229<script type="text/javascript" src="https://webukatu.com/assets/js/plugins/palalaxAnimatePlugin.js?1575572580"></script>
1229 1230
1231<script type="text/javascript"> 1232 $('.slick1').slick({ 1233 autoplay: true, 1234 slidesToShow: 3, 1235 variableWidth: true, 1236 centerMode: true, 1237 arrows: true, 1238 }) 1239 1240</script>
1240 1241 1242 1243<!-- ã¹ã©ã¤ãã¼ã¯ããã¿ã¼å´ã«è¨è¿°ããªãã¨å¤ãªæåããã -->
1244<script type="text/javascript"> 1245 var debug_flg = false; 1246 1247 function dlog(str) { 1248 if (debug_flg === true) { 1249 console.log(str); 1250 } 1251 } 1252 1253 //Ajaxã§ãã©ã¼ã©ã ã³ã¡ã³ãã«æç¨¿ 1254 $('form.js-send-forum').on('submit', function(e) { 1255 e.preventDefault(); 1256 console.log('submit'); 1257 var $this = $(this); 1258 var mapSqlFuncObj = { 1259 set: "SET", 1260 grant: "GRANT", 1261 create: "CREATE", 1262 delete: "DELETE", 1263 drop: "DROP", 1264 show: "SHOW", 1265 select: "SELECT", 1266 insert: "INSERT", 1267 update: "UPDATE", 1268 alter: "ALTER", 1269 and: "AND", 1270 or: "OR", 1271 }; 1272 var replyTxt = $this.children('.js-send-target').val().replace(/\&/g, 'ï¼').replace(/\+/g, 'ï¼').replace(/\</g, 'ï¼').replace(/\>/g, 'ï¼'); 1273 var filterSqlWord = ''; 1274 Object.keys(mapSqlFuncObj).forEach(function(key) { 1275 filterSqlWord += '|' + key; 1276 }); 1277 var filter_ptn = new RegExp(filterSqlWord.substr(1), 'gi'); 1278 replyTxt = replyTxt.replace(filter_ptn, function(matched) { 1279 return mapSqlFuncObj[matched.toLowerCase()]; 1280 }); 1281 var $btn = $this.find('.btn'); 1282 dlog(replyTxt); 1283 dlog($this.data('c1id')); 1284 dlog($this.data('c2id')); 1285 if (replyTxt.length > 0) { 1286 $btn.prop("disabled", true); 1287 $.ajax({ 1288 url: "https://webukatu.com/ajax/comment_add.json", 1289 type: "post", 1290 data: "c1id=" + $this.data('c1id') + "&c2id=" + $this.data('c2id') + "&comment=" + replyTxt, 1291 }).done(function(json) { 1292 1293 console.log('Ajaxæå'); 1294 $btn.prop("disabled", false); 1295 if (json['err_flg']) { //ã¨ã©ã¼ãã©ã°ãï¼ãªã 1296 $('#msg-area p').removeClass('bg-success'); 1297 $('#msg-area p').addClass('bg-danger'); 1298 } else { 1299 $('#msg-area p').removeClass('bg-danger'); 1300 $('#msg-area p').addClass('bg-success'); 1301 } 1302 $('#msg-area p').text(json['msg']); 1303 $('#msg-area').fadeIn(1000).delay(1500).fadeOut(2000); 1304 $this.children('.js-send-target').val(''); 1305 1306 }).fail(function(jqXHR, textStatus) { 1307 console.log('Ajax失æï¼'.textStatus); 1308 }); 1309 } else { 1310 $('#msg-area p').removeClass('bg-success'); 1311 $('#msg-area p').addClass('bg-danger'); 1312 $('#msg-area p').text('ããã¹ããå ¥åãã¦ãã ãã'); 1313 $('#msg-area').fadeIn(1000).delay(1500).fadeOut(2000); 1314 } 1315 1316 }); 1317 1318 //Ajaxã§ãã©ã¼ã©ã ã³ã¡ã³ãã«è¿ä¿¡ 1319 $('form.js-send-reply').on('submit', function(e) { 1320 e.preventDefault(); 1321 console.log('submit'); 1322 var $textForm = $(this).children('.js-send-target'); 1323 var replyTxt = $textForm.val().replace(/\&/g, 'ï¼').replace(/\+/g, 'ï¼').replace(/\</g, 'ï¼').replace(/\>/g, 'ï¼'); 1324 var mapSqlFuncObj = { 1325 set: "SET", 1326 grant: "GRANT", 1327 create: "CREATE", 1328 delete: "DELETE", 1329 drop: "DROP", 1330 show: "SHOW", 1331 select: "SELECT", 1332 insert: "INSERT", 1333 update: "UPDATE", 1334 alter: "ALTER", 1335 and: "AND", 1336 or: "OR", 1337 }; 1338 var filterSqlWord = ''; 1339 Object.keys(mapSqlFuncObj).forEach(function(key) { 1340 filterSqlWord += '|' + key; 1341 }); 1342 var filter_ptn = new RegExp(filterSqlWord.substr(1), 'gi'); 1343 replyTxt = replyTxt.replace(filter_ptn, function(matched) { 1344 return mapSqlFuncObj[matched.toLowerCase()]; 1345 }); 1346 var $btn = $(this).find('.btn'); 1347 dlog(replyTxt); 1348 dlog($(this).data('id')); 1349 if (replyTxt.length > 0) { 1350 $btn.prop("disabled", true); 1351 $.ajax({ 1352 url: "https://webukatu.com/ajax/reply_add.json", 1353 type: "post", 1354 data: "comment_id=" + $(this).data('id') + "&comment=" + replyTxt, 1355 }).done(function(json) { 1356 1357 console.log('Ajaxæå'); 1358 $btn.prop("disabled", false); 1359 $textForm.val(''); 1360 if (json['err_flg']) { //ã¨ã©ã¼ãã©ã°ãï¼ãªã 1361 $('#msg-area p').removeClass('bg-success'); 1362 $('#msg-area p').addClass('bg-danger'); 1363 } else { 1364 $('#msg-area p').removeClass('bg-danger'); 1365 $('#msg-area p').addClass('bg-success'); 1366 } 1367 $('#msg-area p').text(json['msg']); 1368 $('#msg-area').fadeIn(1000).delay(1500).fadeOut(2000); 1369 1370 }).fail(function(jqXHR, textStatus) { 1371 console.log('Ajax失æï¼'.textStatus); 1372 }); 1373 } else { 1374 $('#msg-area p').removeClass('bg-success'); 1375 $('#msg-area p').addClass('bg-danger'); 1376 $('#msg-area p').text('ããã¹ããå ¥åãã¦ãã ãã'); 1377 $('#msg-area').fadeIn(1000).delay(1500).fadeOut(2000); 1378 } 1379 1380 }); 1381 1382 1383 //Ajaxã§ã³ã³ãã³ãï¼ã©ã¼ãã³ã°å®äºå¦ç 1384 function learning_add($flg) { 1385 var $elapsed_minutes = "0"; 1386 if ($flg != '1' && $flg != '2' && $flg != '3' && $flg != '4') { 1387 false; 1388 } 1389 var $elapsed_minutes = $('#elapsed_minutes' + $flg).val(); 1390 if ($elapsed_minutes === "") { 1391 alert("å¦ç¿æéã鏿ãã¦ãã ãã"); 1392 return; 1393 } 1394 var $elapsed_minutes_select = $('#elapsed_minutes' + $flg); 1395 $elapsed_minutes_select.prop("disabled", true); 1396 if ($flg == '3' || $flg == '4') { 1397 var $learning_add = $('#learning_add' + $flg); 1398 } else { 1399 var $learning_add = $('#learning_add'); 1400 } 1401 $learning_add.prop("disabled", true); 1402 var val = $learning_add.attr('value'); 1403 val = val.split(','); 1404 var url = ''; 1405 if ($flg == '1' || $flg == '2') url = "https://webukatu.com/ajax/learning_add.json"; 1406 if ($flg == '3' || $flg == '4') url = "https://webukatu.com/ajax/learning_update.json"; 1407 $.ajax({ 1408 url: url, 1409 type: "post", 1410 data: "c1id=" + val[0] + "&c2id=" + val[1] + "&elapsed_minutes=" + $elapsed_minutes, 1411 }).done(function(json) { 1412 1413 console.log('Ajaxæå'); 1414 if (json['err_flg']) { //ã¨ã©ã¼ãã©ã°ãï¼ãªã 1415 if ($flg == '3' || $flg == '4') { 1416 if (json['err_flg'] == 2) { 1417 alert(json['msg']); 1418 } else { 1419 alert('å¦ç¿æéã®æ´æ°ã«å¤±æãã¾ãããå度ããç´ãã¦ãã ããã'); 1420 } 1421 $elapsed_minutes_select.prop("disabled", false); 1422 $learning_add.prop("disabled", false); 1423 } 1424 } else { //ã¨ã©ã¼ãã©ã°0 1425 if ($flg == '1' || $flg == '2') { 1426 $learning_add.addClass('btn-gray'); 1427 $learning_add.tex 1428 if (json['c2id']) { 1429 location.href = location.protocol + '//' + location.hostname + '/search/contents2_detail?c2id=' + json['c2id'] 1430 } 1431 // $('#learning_add').attr('onClick','learning_del();'); 1432 } 1433 if ($flg == '3' || $flg == '4') { 1434 alert(json['msg']); 1435 $elapsed_minutes_select.prop("disabled", false); 1436 $learning_add.prop("disabled", false); 1437 if ($('#learning_add4')[0]) { 1438 if ($flg == '3') { 1439 $('#elapsed_minutes4').val($elapsed_minutes); 1440 } 1441 if ($flg == '4') { 1442 $('#elapsed_minutes3').val($elapsed_minutes); 1443 } 1444 } 1445 } 1446 } 1447 1448 }).fail(function(jqXHR, textStatus) { 1449 console.log('Ajax失æï¼'.textStatus); 1450 if ($flg == '3' || $flg == '4') { 1451 alert('å¦ç¿æéã®æ´æ°ã«å¤±æãã¾ãããå度ããç´ãã¦ãã ããã'); 1452 $elapsed_minutes_select.prop("disabled", false); 1453 $learning_add.prop("disabled", false); 1454 } 1455 }); 1456 } 1457 1458 1459 $('.like-button').click(function() { 1460 var $clicked_button = $(this); 1461 var updated_id = null; 1462 var col = 'comment-id'; 1463 var like_button_class = $clicked_button.attr('class'); 1464 if (like_button_class.match(/js-like-reply/g)) { 1465 col = 'reply-id'; 1466 } 1467 updated_id = $clicked_button.find('.' + col).val(); 1468 var action = like_button_class.match(/active/g) ? 'delete' : 'add'; 1469 $.ajax({ 1470 url: "https://webukatu.com/ajax/comment_reply_like_update.json", 1471 type: "post", 1472 data: "action=" + action + "&col=" + col.replace(/\-/g, '_') + "&updated_id=" + updated_id, 1473 }).done(function(json) { 1474 //console.log('Ajaxæå'); 1475 if (json['err_flg']) { //ã¨ã©ã¼ãã©ã°ãï¼ãªã 1476 alert(json['msg']); 1477 } else { //ã¨ã©ã¼ãã©ã°0 1478 var $current_num_like = $clicked_button.find('.like-button-number'); 1479 var current_num_like = Number($current_num_like.text()); 1480 if (action == 'add') { 1481 $clicked_button.addClass('active'); 1482 $current_num_like.text(current_num_like + 1); 1483 } 1484 if (action == 'delete') { 1485 $clicked_button.removeClass('active'); 1486 $current_num_like.text(current_num_like - 1); 1487 } 1488 } 1489 }).fail(function(jqXHR, textStatus) { 1490 //console.log('Ajax失æï¼'.textStatus); 1491 alert('æä½ã«å¤±æãã¾ãããç»é¢ãåèªã¿è¾¼ã¿ã®ä¸ããç´ãã¦ãã ããã'); 1492 }); 1493 }); 1494 1495 1496 //Ajaxã§ã³ã³ãã³ãï¼ã©ã¼ãã³ã°æªå®äºå¦ç 1497 //function learning_del(){ 1498 // 1499 //var val = $('#learning_add').attr('value'); 1500 //val = val.split(','); 1501 // $.ajax({ 1502 // url: "//", 1503 // type: "post", 1504 // data: "c1id="+val[0]+"&c2id="+val[1], 1505 // }).done(function(json){ 1506 // 1507 // console.log('Ajaxæå'); 1508 // if(json['err_flg']){ //ã¨ã©ã¼ãã©ã°ãï¼ãªã 1509 // 1510 // }else{ 1511 // 1512 // $('#learning_add').removeClass('btn-gray'); 1513 // $('#learning_add').text('å¦ç¿å®äºï¼'); 1514 // $('#learning_add').attr('onClick','learning_add();'); 1515 // } 1516 // 1517 // }).fail(function(jqXHR, textStatus){ 1518 // console.log('Ajax失æï¼'.textStatus); 1519 // }); 1520 //} 1521 1522 //document.radyã«ããªãã¨ç»åãä¸ç¬å ¨é¨è¡¨ç¤ºããã¦ãã¾ã 1523 $(document).ready(function() { 1524 1525 //ãã¼ã«ããã 1526 $(function($) { 1527 $('p[rel=tooltip]').tooltip(); 1528 }); 1529 1530 //ã¤ã³ã¸ã±ã¼ã¿ã¼ 1531 $('#indicatorContainer1').radialIndicator({ 1532 barColor: { 1533 0: '#FF0000', 1534 30: '#FFFF00', 1535 50: '#0066FF', 1536 80: '#0066FF', 1537 100: '#33CC33' 1538 }, 1539 barWidth: 10, 1540 initValue: 40,
1541 roundCorner: false, 1542 percentage: true 1543 }); 1544 $('#indicatorContainer2').radialIndicator({ 1545 barColor: { 1546 0: '#FF0000', 1547 30: '#FFFF00', 1548 50: '#0066FF', 1549 80: '#0066FF', 1550 100: '#87CEEB' 1551 }, 1552 barWidth: 10, 1553 initValue: 100, 1554 roundCorner: false, 1555 percentage: true 1556 }); 1557 $('#indicatorContainer3').radialIndicator({ 1558 barColor: { 1559 0: '#FF0000', 1560 30: '#FFFF00', 1561 50: '#0066FF', 1562 80: '#0066FF', 1563 100: '#33CC33' 1564 }, 1565 barWidth: 10, 1566 initValue: 80, 1567 roundCorner: false, 1568 percentage: true 1569 }); 1570 $('#indicatorContainer4').radialIndicator({ 1571 barColor: { 1572 0: '#FF0000', 1573 30: '#FFFF00', 1574 50: '#0066FF', 1575 80: '#0066FF', 1576 100: '#33CC33' 1577 }, 1578 barWidth: 10, 1579 initValue: 10, 1580 roundCorner: false, 1581 percentage: true 1582 }); 1583 1584 //ãããã¼èªåé表示 1585 //$("#header").headroom(); 1586 1587 //ãã©ã¼ã ãã¿ã³æ¼ä¸æéæ´»æ§ï¼äºééä¿¡é²æ¢ï¼ 1588 $('form').submit(function() { 1589 if (!$(this).hasClass('js-no-disabled')) { 1590 $(this).find('button[type="submit"]').attr('disabled', 'disabled'); 1591 $(this).find('input[type="submit"]').attr('disabled', 'disabled'); 1592 $(this).find('#send-iken').attr('disabled', 'disabled'); 1593 } 1594 }); 1595 1596 //TimePicker 1597 $('#timepicker1').timepicker({ 1598 minuteStep: 30, 1599 showMeridian: false, 1600 disableFocus: true, 1601 }); 1602 $('#timepicker2').timepicker({ 1603 minuteStep: 30, 1604 showMeridian: false, 1605 disableFocus: true, 1606 }); 1607 1608 //DateTimePicker 1609 $('#datetimepicker').datetimepicker(); 1610 1611 $('#datetimepicker_min_current').datetimepicker({ 1612 minDate: 0, 1613 minTime: 0, 1614 maxDate: new Date() + 7, 1615 step: 30, 1616 defaultDate: new Date(), 1617 }); 1618 1619 $('#datepicker_start').datetimepicker({ 1620 timepicker: false, 1621 format: 'Y/m/d', 1622 onShow: function(ct) { 1623 this.setOptions({ 1624 maxDate: jQuery('#datepicker_end').val() ? jQuery('#datepicker_end').val() : false 1625 }) 1626 }, 1627 }); 1628 $('#datepicker_end').datetimepicker({ 1629 timepicker: false, 1630 format: 'Y/m/d', 1631 onShow: function(ct) { 1632 this.setOptions({ 1633 minDate: jQuery('#datepicker_start').val() ? jQuery('#datepicker_start').val() : false 1634 }) 1635 }, 1636 }); 1637 1638 $('#timepicker_start').datetimepicker({ 1639 step: 30, 1640 datepicker: false, 1641 format: 'H:i', 1642 }); 1643 $('#timepicker_end').datetimepicker({ 1644 step: 30, 1645 datepicker: false, 1646 format: 'H:i', 1647 }); 1648 1649 //ãã§ãã¯ãã¤ãã¦ããå ´åã«ã¯ã»ã¬ã¯ãããã¯ã¹ãéæ´»æ§&é表示 1650 if ($("#form_all_day").attr('checked') == 'checked') { 1651 $("#timepicker_start").attr("disabled", true).parent().hide(); 1652 $("#timepicker_end").attr("disabled", true).parent().hide(); 1653 } 1654 $('label.checkbox-inline').click(function() { 1655 1656 var flag = $('input[name="all_day"]:checked').val(); 1657 1658 if (!flag) { 1659 $("#timepicker_start").attr("disabled", true).parent().hide(); 1660 $("#timepicker_end").attr("disabled", true).parent().hide(); 1661 } else { 1662 $("#timepicker_start").attr("disabled", false).parent().show(); 1663 $("#timepicker_end").attr("disabled", false).parent().show(); 1664 } 1665 }); 1666 $(".icheckbox_flat-red").click(function() { 1667 1668 var flag2 = $('input[name="all_day"]:checked').val(); 1669 1670 alert('ok'); 1671 1672 if (!flag2) { 1673 $("#timepicker_start").attr("disabled", true).parent().hide(); 1674 $("#timepicker_end").attr("disabled", true).parent().hide(); 1675 } else { 1676 $("#timepicker_start").attr("disabled", false).parent().show(); 1677 $("#timepicker_end").attr("disabled", false).parent().show(); 1678 } 1679 1680 }); 1681 1682 //éå§æ¥ãå ¥ã£ã¦ããããéå§æ¥ãçµäºæ¥ã¸èªåè¨å®ãã 1683 $('#datepicker_start').change(function() { 1684 var data = $(this).val(); 1685 $('#datepicker_end').val(data); 1686 }); 1687 1688 //éå§æå»ãå ¥åããæç¹ã§ãéå§æå»ãçµäºæå»ã¸ï¼ï¼æéè¶³ãã¦èªåè¨å®ãã 1689 $('#timepicker_start').change(function() { 1690 var data = $(this).val(); 1691 $('#timepicker_end').val(data); 1692 }); 1693 1694 1695 //Ajaxã§ç»å鏿æã«ã¢ãããã¼ã 1696 $('.ajax-upload').change(function(e) { 1697 1698 var name = $(this).attr('name'); 1699 1700 var file = $(this).prop('files')[0]; 1701 var img_url = file.name; 1702 1703 var filedata = new FormData(); 1704 filedata.append("files", file); 1705 1706 $.ajax({ 1707 url: "https://webukatu.com/ajax/img.json", 1708 type: "post", 1709 processData: false, 1710 contentType: false, 1711 data: filedata, 1712 }).done(function(json) { 1713 1714 console.log('Ajaxæå'); 1715 1716 //ã¨ã©ã¼ãã©ã°ãããå ´å 1717 if (json['error_flg']) { 1718 1719 console.log(json['message']); 1720 1721 //ã¨ã©ã¼ã¡ãã»ã¼ã¸è¡¨ç¤º 1722 $('#msg-area p').text(json['message']); 1723 $('#msg-area').fadeIn(1000).delay(1500).fadeOut(2000); 1724 1725 } else {
1726 //ã¨ã©ã¼ãã©ã°ããªãå ´å 1727 //夿´ããinputã®name屿§å¤ã¨åãID屿§ã®imgã¿ã°ã®src屿§ãæ¸ãæãã 1728 $('#' + name).attr('src', 'https://webukatu.com/assets/uploads/' + json[0]['saved_as']); 1729 1730 //input[type=hiden]ãname屿§=ã¢ãããã¼ããããã¡ã¤ã«åã§è¿½å 1731 $('form').append('<input type="hidden" name="hidden_' + name + '" value="' + json[0]['saved_as'] + '" />'); 1732 } 1733 1734 }).fail(function(jqXHR, textStatus) { 1735 console.log('Ajax失æï¼'.textStatus); 1736 }); 1737 }); 1738 1739 //Ajaxã§äºç´ç¶æ³ã®ãã£ã³ã»ã«å¦ç 1740 $('.reservation_canceled').click(function(e) { 1741 1742 var r_id = $(this).attr('value'); 1743 1744 $.ajax({ 1745 url: "https://webukatu.com/ajax/reservation_canceled.json", 1746 type: "post", 1747 data: "r_id=" + r_id, 1748 }).done(function(json) { 1749 1750 console.log('Ajaxæå'); 1751 1752 if (json['rst'] == true) { 1753 1754 //ã¹ãã¼ã¿ã¹ãè¨å® 1755 $('#flag_' + r_id).text('ãã£ã³ã»ã«'); 1756 //確å®ãã¿ã³ã¨ãã£ã³ã»ã«ãã¿ã³ãé表示 1757 $('#reservation_canceled_' + r_id).hide(); 1758 $('#reservation_fixed_' + r_id).hide(); 1759 //ã¡ãã»ã¼ã¸è¡¨ç¤º 1760 $('#msg-area p').removeClass('bg-danger'); 1761 $('#msg-area p').addClass('bg-success'); 1762 $('#msg-area p').text('äºç´ããã£ã³ã»ã«ãã¾ãã'); 1763 $('#msg-area').fadeIn(1000).delay(1500).fadeOut(2000); 1764 } else { 1765 //ã¨ã©ã¼ã¡ãã»ã¼ã¸è¡¨ç¤º 1766 $('#msg-area p').removeClass('bg-success'); 1767 $('#msg-area p').addClass('bg-danger'); 1768 $('#msg-area p').text('äºç´ã®ãã£ã³ã»ã«å¦çã«å¤±æãã¾ãã'); 1769 $('#msg-area').fadeIn(1000).delay(1500).fadeOut(2000); 1770 } 1771 1772 }).fail(function(jqXHR, textStatus) { 1773 console.log('Ajax失æï¼'.textStatus); 1774 //ã¨ã©ã¼ã¡ãã»ã¼ã¸è¡¨ç¤º 1775 $('#msg-area p').removeClass('bg-success'); 1776 $('#msg-area p').addClass('bg-danger'); 1777 $('#msg-area p').text('äºç´ã®ãã£ã³ã»ã«å¦çã«å¤±æãã¾ãã'); 1778 $('#msg-area').fadeIn(1000).delay(1500).fadeOut(2000); 1779 }); 1780 }); 1781 1782 //Ajaxã§äºç´ç¶æ³ã®ç¢ºå®å¦ç 1783 $('.reservation_fixed').click(function(e) { 1784 1785 var r_id = $(this).attr('value'); 1786 1787 $.ajax({ 1788 url: "https://webukatu.com/ajax/reservation_fixed.json", 1789 type: "post", 1790 data: "r_id=" + r_id, 1791 }).done(function(json) { 1792 1793 console.log('Ajaxæå'); 1794 1795 if (json['rst'] == true) { 1796 1797 //ã¹ãã¼ã¿ã¹ãè¨å® 1798 $('#flag_' + r_id).text('確å®'); 1799 //確å®ãã¿ã³ã¨ãã£ã³ã»ã«ãã¿ã³ãé表示 1800 $('#reservation_canceled_' + r_id).hide(); 1801 $('#reservation_fixed_' + r_id).hide(); 1802 //ã¡ãã»ã¼ã¸è¡¨ç¤º 1803 $('#msg-area p').removeClass('bg-danger'); 1804 $('#msg-area p').addClass('bg-success'); 1805 $('#msg-area p').text('äºç´ã確å®ãã¾ãã'); 1806 $('#msg-area').fadeIn(1000).delay(1500).fadeOut(2000); 1807 } else { 1808 //ã¨ã©ã¼ã¡ãã»ã¼ã¸è¡¨ç¤º 1809 $('#msg-area p').removeClass('bg-success'); 1810 $('#msg-area p').addClass('bg-danger'); 1811 $('#msg-area p').text('äºç´ã®ç¢ºå®å¦çã«å¤±æãã¾ãã'); 1812 $('#msg-area').fadeIn(1000).delay(1500).fadeOut(2000); 1813 } 1814 1815 }).fail(function(jqXHR, textStatus) { 1816 console.log('Ajax失æï¼'.textStatus); 1817 //ã¨ã©ã¼ã¡ãã»ã¼ã¸è¡¨ç¤º 1818 $('#msg-area p').removeClass('bg-success'); 1819 $('#msg-area p').addClass('bg-danger'); 1820 $('#msg-area p').text('äºç´ã®ç¢ºå®å¦çã«å¤±æãã¾ãã'); 1821 $('#msg-area').fadeIn(1000).delay(1500).fadeOut(2000); 1822 }); 1823 }); 1824 1825 //Ajaxã§ã³ã³ãã³ãï¼ã®ããã¯ãã¼ã¯è¿½å å¦ç 1826 $('.favorite1_add').click(function(e) { 1827 1828 var val = $(this).attr('value'); 1829 $.ajax({ 1830 url: "https://webukatu.com/ajax/contents1_add.json", 1831 type: "post", 1832 data: "c1id=" + val, 1833 }).done(function(json) { 1834 1835 console.log('Ajaxæå'); 1836 $('#msg-area p').text(json['msg']); 1837 if (json['err_flg']) { //ã¨ã©ã¼ãã©ã°ãï¼ãªã 1838 $('#msg-area p').removeClass('bg-success'); 1839 $('#msg-area p').addClass('bg-danger'); //èæ¯è²ã赤㫠1840 } else { 1841 $('#msg-area p').removeClass('bg-danger'); 1842 $('#msg-area p').addClass('bg-success'); //èæ¯è²ãç·ã« 1843 } 1844 $('#msg-area').fadeIn(1000).delay(1500).fadeOut(2000); 1845 1846 }).fail(function(jqXHR, textStatus) { 1847 console.log('Ajax失æï¼'.textStatus); 1848 }); 1849 }); 1850 1851 //Ajaxã§ã³ã³ãã³ã2ã®ããã¯ãã¼ã¯è¿½å å¦ç 1852 $('.favorite2_add').click(function(e) { 1853 1854 var val = $(this).attr('value'); 1855 1856 $.ajax({ 1857 url: "https://webukatu.com/ajax/contents2_add.json", 1858 type: "post", 1859 data: "c2id=" + val, 1860 }).done(function(json) { 1861 1862 console.log('Ajaxæå'); 1863 1864 $('#msg-area p').text(json['msg']); 1865 if (json['err_flg']) { //ã¨ã©ã¼ãã©ã°ãï¼ãªã 1866 $('#msg-area p').removeClass('bg-success'); 1867 $('#msg-area p').addClass('bg-danger'); //èæ¯è²ã赤㫠1868 } else { 1869 $('#msg-area p').removeClass('bg-danger'); 1870 $('#msg-area p').addClass('bg-success'); //èæ¯è²ãç·ã« 1871 } 1872 $('#msg-area').fadeIn(1000).delay(1500).fadeOut(2000); 1873 1874 }).fail(function(jqXHR, textStatus) { 1875 console.log('Ajax失æï¼'.textStatus); 1876 }); 1877 }); 1878 1879 //Ajaxã§ã³ã³ãã³ã2ã®ããã¯ãã¼ã¯åé¤å¦ç 1880 $('.favorite2_del').click(function(e) { 1881 1882 var val = $(this).attr('value'); 1883 1884 $.ajax({ 1885 url: "https://webukatu.com/ajax/contents2_delete.json", 1886 type: "post", 1887 data: "c2id=" + val, 1888 }).done(function(json) { 1889 1890 console.log('Ajaxæå'); 1891 1892 if (json['err_flg']) { //ã¨ã©ã¼ãã©ã°ãï¼ãªã 1893 $('#msg-area p').removeClass('bg-success'); 1894 $('#msg-area p').addClass('bg-danger'); //èæ¯è²ã赤㫠1895 $('#msg-area p').text(json['msg']); 1896 $('#msg-area').fadeIn(1000).delay(1500).fadeOut(2000); 1897 } else { 1898 1899 $('#favorite2_del_' + val).fadeOut(1000); //ã³ã³ãã³ããé ã 1900 } 1901 1902 }).fail(function(jqXHR, textStatus) { 1903 console.log('Ajax失æï¼'.textStatus); 1904 }); 1905 }); 1906 1907 //Ajaxã§ã³ã³ãã³ãï¼ã®ããã¯ãã¼ã¯åé¤å¦ç 1908 $('.favorite1_del').click(function(e) { 1909 1910 var val = $(this).attr('value'); 1911 1912 $.ajax({ 1913 url: "https://webukatu.com/ajax/contents1_delete.json", 1914 type: "post", 1915 data: "c1id=" + val, 1916 }).done(function(json) { 1917 1918 console.log('Ajaxæå'); 1919 1920 if (json['err_flg']) { //ã¨ã©ã¼ãã©ã°ãï¼ãªã 1921 $('#msg-area p').removeClass('bg-success'); 1922 $('#msg-area p').addClass('bg-danger'); //èæ¯è²ã赤㫠1923 $('#msg-area p').text(json['msg']); 1924 $('#msg-area').fadeIn(1000).delay(1500).fadeOut(2000); 1925 } else { 1926 1927 $('#favorite1_del_' + val).fadeOut(1000); //ã³ã³ãã³ããé ã 1928 } 1929 1930 }).fail(function(jqXHR, textStatus) { 1931 console.log('Ajax失æï¼'.textStatus); 1932 }); 1933 }); 1934 1935 //Ajaxã§æè¦ã®ã¡ã¼ã«éä¿¡å¦ç 1936 $('#send-iken').click(function(e) { 1937 1938 var val = $('#iken-area').attr('value'); 1939 if (val) { 1940 $.ajax({ 1941 url: "https://webukatu.com/ajax/send_mail.json", 1942 type: "post", 1943 data: "comment=" + val, 1944 }).done(function(json) { 1945 1946 console.log('Ajaxæå'); 1947 1948 if (json['rst']) { 1949 $('#iken-area').attr('value', ''); 1950 $('#msg-area p').removeClass('bg-danger'); 1951 $('#msg-area p').addClass('bg-success'); 1952 $('#msg-area p').text('éä¿¡ãã¾ããããæè¦é ããããã¨ããããã¾ãã'); 1953 $('#msg-area').fadeIn(1000).delay(1500).fadeOut(2000); 1954 } else { 1955 1956 //ã¨ã©ã¼ã¡ãã»ã¼ã¸è¡¨ç¤º 1957 $('#msg-area p').removeClass('bg-success'); 1958 $('#msg-area p').addClass('bg-danger'); 1959 $('#msg-area p').text('éä¿¡åºæ¥ã¾ããã§ããã'); 1960 $('#msg-area').fadeIn(1000).delay(1500).fadeOut(2000); 1961 } 1962 1963 }).fail(function(jqXHR, textStatus) { 1964 console.log('Ajax失æï¼'.textStatus); 1965 //ã¨ã©ã¼ã¡ãã»ã¼ã¸è¡¨ç¤º 1966 $('#msg-area p').removeClass('bg-success'); 1967 $('#msg-area p').addClass('bg-danger'); 1968 $('#msg-area p').text('éä¿¡åºæ¥ã¾ããã§ããã'); 1969 $('#msg-area').fadeIn(1000).delay(1500).fadeOut(2000); 1970 }); 1971 } else { 1972 $('#msg-area p').removeClass('bg-success'); 1973 $('#msg-area p').addClass('bg-danger'); 1974 $('#msg-area p').text('å ¥åãããã¾ãã'); 1975 $('#msg-area').fadeIn(1000).delay(1500).fadeOut(2000); 1976 1977 } 1978 }); 1979 1980 //Ajaxã§ãããåãæ¿ãå¦ç 1981 $('.btn-area').click(function(e) { 1982 1983 var val = $(this).attr('id'); 1984 1985 $.ajax({ 1986 url: "https://webukatu.com/ajax/changeMap.json", 1987 type: "post", 1988 data: "area=" + val, 1989 }).done(function(json) { 1990 1991 console.log('Ajaxæå'); 1992 $('#area-map').fadeOut(); 1993 $('#area-map').html(json['map']).hide(); 1994 $('#area-map').fadeIn(); 1995 1996 }).fail(function(jqXHR, textStatus) { 1997 console.log('Ajax失æï¼'.textStatus); 1998 }); 1999 }); 2000 2001 2002 //æ°åã®ãã©ã¼ã ããã©ã¼ã«ã¹ã¢ã¦ãæã«èªååè§å¤æ 2003 $('.numeric').change(function() { 2004 var txt = $(this).val(); 2005 var han = txt.replace(/[A-Zï½-ï½ï¼-ï¼]/g, function(s) { 2006 return String.fromCharCode(s.charCodeAt(0) - 0xFEE0) 2007 }); 2008 $(this).val(han); 2009 }); 2010 2011 //ã¢ã¼ãã«ã¦ã£ã³ãã¦
2012 $('#myModal').modal('hide'); 2013 $('#search-area-modal1').modal('hide'); 2014 $('#search-area-modal2').modal('hide'); 2015 $('#search-area-modal3').modal('hide'); 2016 $('#search-area-modal4').modal('hide'); 2017 2018 //ã¢ã³ã¼ãã£ãªã³ããã« 2019 $('.collapse').collapse(); 2020 2021 //textareaã«ã¦ã³ã 2022 $('#comment').bind('keyup', function() { 2023 var thisValueLength = $(this).val().length; 2024 $('.count').html(thisValueLength); 2025 }); 2026 $('#comment1').bind('keyup', function() { 2027 var thisValueLength = $(this).val().length; 2028 $('.count1').html(thisValueLength); 2029 }); 2030 $('#comment2').bind('keyup', function() { 2031 var thisValueLength = $(this).val().length; 2032 $('.count2').html(thisValueLength); 2033 }); 2034 $('#comment3').bind('keyup', function() { 2035 var thisValueLength = $(this).val().length; 2036 $('.count3').html(thisValueLength); 2037 }); 2038 $('#comment4').bind('keyup', function() { 2039 var thisValueLength = $(this).val().length; 2040 $('.count4').html(thisValueLength); 2041 }); 2042 $('#comment5').bind('keyup', function() { 2043 var thisValueLength = $(this).val().length; 2044 $('.count5').html(thisValueLength); 2045 }); 2046 2047 //ãã¼ã«ããã 2048 $('[data-toggle="tooltip"]').tooltip(); 2049 2050 //ã¿ãã¡ãã¥ã¼è¡¨ç¤º 2051 $('#mypage_tab a').click(function(e) { 2052 e.preventDefault() 2053 $(this).tab('show') 2054 }); 2055 $('#top_tab a').click(function(e) { 2056 e.preventDefault() 2057 $(this).tab('show') 2058 }); 2059 2060 2061 //icheckèªè¾¼ã¿ 2062 $("input").iCheck({ 2063 checkboxClass: "icheckbox_flat-red", //使ç¨ãããã¼ãã®ã¹ãã³ãæå®ãã 2064 radioClass: "iradio_flat-red", //使ç¨ãããã¼ãã®ã¹ãã³ãæå®ãã 2065 increaseArea: '20%' 2066 }); 2067 2068 //ã¹ããç¨ã¹ã©ã¤ãã¡ãã¥ã¼ 2069 $("#menu-toggle").click(function() { 2070 $("#top-menu").slideToggle(); 2071 }); 2072 2073 2074 //ç»åã¹ã©ã¤ãã¼ 2075 $('.flexslider').flexslider({ 2076 animation: "slide", 2077 controlNav: "thumbnails" 2078 }); 2079 $('.flexslider2').flexslider({ 2080 animation: "slide", 2081 }); 2082 $('.flexslider-custom1').flexslider({ 2083 animation: "slide", 2084 controlNav: true 2085 }); 2086 2087 //ç»åèªåãªãµã¤ãº 2088 $(".img-liquid").imgLiquid(); 2089 2090 //ã¹ã¯ãã¼ã«è¡¨ç¤º 2091 $('.scrollFade').scrollFade(); 2092 2093 //ãã¼ã¸ãããã¸æ»ã 2094 var topBtn = $('#pageTop'); 2095 topBtn.hide(); 2096 $(window).scroll(function() { 2097 if ($(this).scrollTop() > 100) { 2098 topBtn.fadeIn(); 2099 } else { 2100 topBtn.fadeOut(); 2101 } 2102 }); 2103 topBtn.click(function() { 2104 $('body,html').animate({ 2105 scrollTop: 0 2106 }, 1000); 2107 return false; 2108 }); 2109 2110 //ãããã¼ãä¸ã¹ã¯ãã¼ã«ã§é表示㫠2111 var startPos = 0, 2112 winScrollTop = 0; 2113 $(window).on('scroll', function() { 2114 winScrollTop = $(this).scrollTop(); 2115 heroHeight = $('#hero').height(); 2116 if (winScrollTop > heroHeight) { 2117 $('.c-header').addClass('c-header-bg'); 2118 } else { 2119 $('.c-header').removeClass('c-header-bg'); 2120 } 2121 2122 if (winScrollTop >= startPos) { 2123 $('.c-header').addClass('move'); 2124 $('.c-cv-sp').removeClass('move'); 2125 } else { 2126 $('.c-header').removeClass('move'); 2127 $('.c-cv-sp').addClass('move'); 2128 } 2129 startPos = winScrollTop; 2130 }); 2131 2132 2133 //ã¡ãã»ã¼ã¸ã¨ãªã¢è¡¨ç¤º 2134 $("#msg-area p").change(function() { 2135 $('#msg-area').fadeIn(1000).delay(3000).fadeOut(2000); 2136 }); 2137 var msg = $('#msg-area p').text(); 2138 if (msg != '') $('#msg-area').fadeIn(1000).delay(3000).fadeOut(2000); 2139 2140 2141 // #ã§å§ã¾ãã¢ã³ã«ã¼ãã¯ãªãã¯ããå ´åã¹ã ã¼ãºã«ã¹ã¯ãã¼ã«ãããå¦ç 2142 /* 2143 $('a[href^=#]').click(function() { 2144 // ã¹ã¯ãã¼ã«ã®é度 2145 var speed = 1000; // ããªç§ 2146 // ã¢ã³ã«ã¼ã®å¤åå¾ 2147 var href= $(this).attr("href"); 2148 // ç§»åå ãåå¾ 2149 var target = $(href == "#" || href == "" ? 'html' : href); 2150 // ç§»åå ãæ°å¤ã§åå¾ 2151 var position = target.offset().top; 2152 // ã¹ã ã¼ã¹ã¹ã¯ãã¼ã« 2153 $('body,html').animate({scrollTop:position}, speed, 'swing'); 2154 return false; 2155 }); 2156 */ 2157 2158 $(".iradio_flat-red .iCheck-helper").click(function() { 2159 var ctg3 = $('input[name="category3_id_radio_required"]:checked').val(); 2160 2161 if (ctg3 == 1) { 2162 $('input[name="zip_required"]').val('').attr("disabled", true); 2163 $('select#pref').val('').attr("disabled", true); 2164 $('input[name="addr_required"]').val('').attr("disabled", true); 2165 } 2166 if (ctg3 == 2 || ctg3 == 4) { 2167 $('input[name="zip_required"]').val('').attr("disabled", true); 2168 $('select#pref').val('').attr("disabled", true); 2169 $('input[name="addr_required"]').attr("disabled", false); 2170 } 2171 if (ctg3 == 3) { 2172 $('input[name="zip_required"]').attr("disabled", false); 2173 $('select#pref').attr("disabled", false); 2174 $('input[name="addr_required"]').attr("disabled", false); 2175 } 2176 2177 }); 2178 $("label.category3_id").click(function() { 2179 var ctg3 = $('input[name="category3_id_radio_required"]:checked').val(); 2180 2181 if (ctg3 == 1) { 2182 $('input[name="zip_required"]').val('').attr("disabled", true); 2183 $('select#pref').val('').attr("disabled", true); 2184 $('input[name="addr_required"]').val('').attr("disabled", true); 2185 } 2186 if (ctg3 == 2 || ctg3 == 4) { 2187 $('input[name="zip_required"]').val('').attr("disabled", true); 2188 $('select#pref').val('').attr("disabled", true); 2189 $('input[name="addr_required"]').attr("disabled", false); 2190 } 2191 if (ctg3 == 3) { 2192 $('input[name="zip_required"]').attr("disabled", false); 2193 $('select#pref').attr("disabled", false); 2194 $('input[name="addr_required"]').attr("disabled", false); 2195 } 2196 }); 2197 2198 var ctg3 = $('input[name="category3_id_radio_required"]:checked').val(); 2199 if (ctg3 == 1) { 2200 $('input[name="zip_required"]').val('').attr("disabled", true); 2201 $('select#pref').val('').attr("disabled", true); 2202 $('input[name="addr_required"]').val('').attr("disabled", true); 2203 } 2204 if (ctg3 == 2 || ctg3 == 4) { 2205 $('input[name="zip_required"]').val('').attr("disabled", true); 2206 $('select#pref').val('').attr("disabled", true); 2207 $('input[name="addr_required"]').attr("disabled", false); 2208 } 2209 if (ctg3 == 3) { 2210 $('input[name="zip_required"]').attr("disabled", false); 2211 $('select#pref').attr("disabled", false); 2212 $('input[name="addr_required"]').attr("disabled", false); 2213 } 2214 2215 //使èªåå ¥å 2216 /* 2217 $('#zip').jpostal({ 2218 postcode : [ 2219 '#zip' 2220 ], 2221 address : { 2222 '#pref' : '%3', 2223 '#addr' : '%4%5' 2224 } 2225 }); 2226 2227 */ 2228 $("#loading").fadeOut(); 2229 2230 2231 //var $jsAnimatePalalax = $(".top-baner .title"); 2232 var $jsAnimateFadeInNone = $('.js-animate-fadeIn-none'); 2233 var $jsAnimateFadeInTop = $('.js-animate-fadeIn-top'); 2234 var $jsAnimateFadeInRight = $('.js-animate-fadeIn-right'); 2235 var $jsAnimateFadeInLeft = $('.js-animate-fadeIn-left'); 2236 var $jsAnimateHover = $('.js-animate-hover'); 2237 2238 // ãã¦ã¹ãªã¼ãã¼ã¢ãã¡ã¼ã·ã§ã³ 2239 $jsAnimateHover.animateHover({ 2240 rotateZ: '5deg', 2241 scale: 1.2 2242 }); 2243 2244 // ã¢ãã¡ã¼ã·ã§ã³ 2245 $jsAnimateFadeInNone.animateFadeIn({ 2246 duration: 1000, 2247 }); 2248 $jsAnimateFadeInRight.animateFadeIn({ 2249 direction: 'R',
2250 duration: 800, 2251 }); 2252 $jsAnimateFadeInLeft.animateFadeIn({ 2253 direction: 'L', 2254 duration: 800, 2255 }); 2256 $jsAnimateFadeInTop.animateFadeIn({ 2257 direction: 'T', 2258 duration: 800, 2259 }); 2260 /* 2261 $jsAnimatePalalax.animatePalalax({ 2262 direction: 'B' 2263 }); 2264 */ 2265 2266 $('.js-qa-q').on('click', function(e) { 2267 $(this).siblings('.js-qa-a').css("min-height", 0).slideToggle('slow', function() { 2268 $(this).css("min-height", "120px"); 2269 }); 2270 $(this).toggleClass('open'); 2271 }); 2272 //ã¢ã³ã¼ãã£ãªã³ããã« 2273 var $acordionAction = $('.js-acordion-action'); 2274 $acordionAction.on('click', function(e) { 2275 $(this).siblings('.js-acordion-target').slideToggle(); 2276 }); 2277 //ã¢ã³ã¼ãã£ãªã³ããã«ï¼è³ªåä¸è¦§ï¼ 2278 var $questionAction = $('.js-question-action'); 2279 $questionAction.on('click', function(e) { 2280 //ã¯ãªãã¯ã§ã³ã³ãã³ããéé 2281 $(this).siblings('.js-question-target').slideToggle(); 2282 //è¦ç´ å ã®ããã¹ãã夿´ 2283 $(this).find('.js-question-text').toggle(); 2284 //ã³ã¡ã³ãã表示横ã®ç¢å°ã®åãã夿´ 2285 $(this).find('.comment-open').toggleClass('open'); 2286 }); 2287 //ã¢ã³ã¼ãã£ãªã³ããã«ï¼è¿ä¿¡ãã©ã¼ã ï¼ 2288 var $formOpen = $('.js-reply-form-open'); 2289 $formOpen.on('click', function(e) { 2290 //è¿ä¿¡ãããã¿ã³ã¯ãªãã¯ã§ãã©ã¼ã ãéé 2291 $(this).siblings('.js-reply-form-target').slideToggle(); 2292 //親è¦ç´ ã¸ã®ä¼æé²æ¢ï¼ãã©ã¼ã ééæã«ãã³ã¡ã³ãä¸è¦§ãéãã¦ãã¾ããªãããã«ããï¼ 2293 event.stopPropagation(); 2294 }); 2295 var $formClose = $('.js-reply-form-close'); 2296 $formClose.on('click', function(e) { 2297 //ãã£ã³ã»ã«ãã¿ã³ã¯ãªãã¯ã§ãã©ã¼ã ãéãã 2298 $(this).parent().parent().parent('.js-reply-form-target').slideUp(); 2299 //親è¦ç´ ã¸ã®ä¼æé²æ¢ï¼ãã©ã¼ã ééæã«ãã³ã¡ã³ãä¸è¦§ãéãã¦ãã¾ããªãããã«ããï¼ 2300 event.stopPropagation(); 2301 }); 2302 //ããã¹ãã¨ãªã¢ã«ã¦ã³ã 2303 var $txtCountAction = $('.js-count-action'); 2304 $txtCountAction.on('keyup', function(e) { 2305 var txtCount = $(this).val().length; 2306 var $txtCountTarget = $(this).siblings('.js-count-target').children('.js-set-target'); 2307 $txtCountTarget.html(txtCount); 2308 if (txtCount > 500) { 2309 $txtCountTarget.css('color', 'red'); 2310 } 2311 }); 2312 2313 //ããã¼ã«ããåç»åç 2314 $('.js-video-btn').hover(function() { 2315 $(this).siblings('.js-video')[0].play(); 2316 }, function() { 2317 $(this).siblings('.js-video')[0].pause(); 2318 }); 2319 2320 //ã ã¼ãã¼ãè¦ãã¨ãªã¢ 2321 $('#js-click-contents-show-action').on('click', function(e) { 2322 var $this = $(this); 2323 $this.parent('#js-click-contents-show-target').slideToggle(); 2324 dlog($this.data('c1id')); 2325 dlog($this.data('c2id')); 2326 $.ajax({ 2327 url: "https://webukatu.com/ajax/histLearning_add.json", 2328 type: "post", 2329 data: "c1id=" + $this.data('c1id') + "&c2id=" + $this.data('c2id'), 2330 }).done(function(json) { 2331 2332 dlog($this.data('Ajaxæå')); 2333 if (json['err_flg']) { //ã¨ã©ã¼ãã©ã°ãï¼ãªã 2334 dlog($this.data('ç»é²ã¨ã©ã¼')) 2335 } else { 2336 dlog($this.data('ç»é²æå')) 2337 } 2338 2339 }).fail(function(jqXHR, textStatus) { 2340 dlog($this.data('Ajax失æ'.textStatus)); 2341 }); 2342 2343 }); 2344 2345 //ä»®å ¥é¨æªè¦è´ã¢ã³ã±ã¼ãçç±ã®è©³ç´°ç¨ 2346 $('.js-trial-reason-check').on('click', function() { 2347 2348 var $detail = $('.js-trial-reason-detail'); 2349 var reason = parseInt($(this).find('input[name="nowatchreason_radio_required"]:radio').val()); 2350 2351 if (reason === 1) { 2352 $detail.find('strong').text("ã©ã®æ§ãªå 容ãã叿ã§ãããï¼"); 2353 } else if (reason === 2 || reason === 3) { 2354 $detail.find('strong').text("æ¹åã®ããã«è©³ããå 容ãæãã¦ä¸ããã"); 2355 } else if (reason === 4) { 2356 $detail.find('strong').text("å·®ãæ¯ããªããã°è©³ããçç±ããèããä¸ãã"); 2357 } else if (reason === 5) { 2358 $detail.find('strong').text("ã©ã®ãµã¼ãã¹ã¨æ¯è¼ããã¾ãããï¼"); 2359 } else { 2360 $detail.find('strong').text("詳ããçç±ããèããä¸ãã"); 2361 } 2362 $detail.fadeIn(); 2363 }); 2364
2365 //inputé¨åãä¸è¨ã§ã¯åä½ããªãã®ã§å¥ã«ä½æ 2366 $('.js-trial-reason-check').find('.iCheck-helper').on('click', function() { 2367 2368 var $detail = $('.js-trial-reason-detail'); 2369 var reason = parseInt($(this).prev('input[name="nowatchreason_radio_required"]:radio').val()); 2370 2371 if (reason === 1) { 2372 $detail.find('strong').text("ã©ã®æ§ãªå 容ãã叿ã§ãããï¼"); 2373 } else if (reason === 2 || reason === 3) { 2374 $detail.find('strong').text("æ¹åã®ããã«è©³ããå 容ãæãã¦ä¸ããã"); 2375 } else if (reason === 4) { 2376 $detail.find('strong').text("å·®ãæ¯ããªããã°è©³ããçç±ããèããä¸ãã"); 2377 } else if (reason === 5) { 2378 $detail.find('strong').text("ã©ã®ãµã¼ãã¹ã¨æ¯è¼ããã¾ãããï¼"); 2379 } else { 2380 $detail.find('strong').text("詳ããçç±ããèããä¸ãã"); 2381 } 2382 $detail.fadeIn(); 2383 2384 }); 2385 2386 //éä¼ãã©ã¼ã çç±ã®è©³ç´°ç¨ 2387 $('.js-reason-check').on('click', function() { 2388 2389 var $detail = $('.js-reason-detail'); 2390 var $other = $('.js-reason-other'); 2391 var reason = parseInt($(this).find('input[name="reason_radio_required"]:radio').val()); 2392 var $placeholder = $('.js-reason-textarea') 2393 2394 if (reason === 1 || reason === 2) { 2395 $detail.find('strong').text("å·®ãæ¯ããªããã°è©³ããçç±ããèããä¸ãã"); 2396 $other.css('display', 'none') 2397 $placeholder.attr('placeholder', ''); 2398 } else if (reason === 3) { 2399 $detail.find('strong').text("ã¢ããã¼ã·ã§ã³ãä½ä¸ããã®ã¯ãªãã§ããï¼"); 2400 $other.css('display', 'block') 2401 $placeholder.attr('placeholder', ''); 2402 } else if (reason === 4) { 2403 $detail.find('strong').text("ç°¡åãªæ¥åå 容ã¨å¹´åãå°±è·æ´»åå 容ãæãã¦ä¸ãã"); 2404 $other.css('display', 'block') 2405 $placeholder.attr('placeholder', 'ä¾ï¼ââæ ªå¼ä¼ç¤¾ï¼å¹´å400ä¸ï¼ã¨ÃÃå¶ä½ä¼ç¤¾(å¹´å350ä¸ï¼ãã2020å¹´5æã«å å®ãé ãã¾ãããã¨ã¼ã¸ã§ã³ãã¯ä½¿ç¨ããwantedlyã¨greenãå©ç¨ãã¾ãããæçµçã«ââæ ªå¼ä¼ç¤¾ã«å°±è·ããç¾å¨ã¯Reactãç¨ããããã³ãã¨ã³ãæ¥åã«å¾äºãã¦ãã¾ãã'); 2406 } else if (reason === 5) { 2407 $detail.find('strong').text("ç°¡åãªæ¥åå 容ã¨å¹´åãå°±è·æ´»åå 容ãæãã¦ä¸ãã"); 2408 $other.css('display', 'block') 2409 $placeholder.attr('placeholder', 'ä¾ï¼ââæ ªå¼ä¼ç¤¾ï¼å¹´å400ä¸ï¼ã¨ÃÃæéä¼ç¤¾(å¹´å350ä¸ï¼ãã2020å¹´5æã«å å®ãé ãã¾ãããdodaã¨wantedlyãå©ç¨ãã¾ãããæçµçã«ââæ ªå¼ä¼ç¤¾ã«å°±è·ããç¾å¨ã¯ãã¼ã±ãã£ã³ã°æ¥åã«æºãã£ã¦ãã¾ãã'); 2410 } else if (reason === 6) { 2411 $detail.find('strong').text("ããããäºã¨ã¯ã©ããªãã®ã§ããï¼"); 2412 $other.css('display', 'block') 2413 $placeholder.attr('placeholder', ''); 2414 } else if (reason === 7) { 2415 $detail.find('strong').text("ã©ããªç®æ¨ãéæããã¾ãããï¼"); 2416 $other.css('display', 'block') 2417 $placeholder.attr('placeholder', ''); 2418 } else if (reason === 8) { 2419 $detail.find('strong').text("ããªãã«åããªãã£ãé¨åãæãã¦ä¸ãã"); 2420 $other.css('display', 'block') 2421 $placeholder.attr('placeholder', ''); 2422 } else if (reason === 9) { 2423 $detail.find('strong').text("ã©ã®ã¹ã¯ã¼ã«ã»ãµã¼ãã¹ããå©ç¨äºå®ã§ããï¼"); 2424 $other.css('display', 'block') 2425 $placeholder.attr('placeholder', ''); 2426 } else { 2427 $detail.find('strong').text("詳ããçç±ããèããä¸ãã"); 2428 $other.css('display', 'none') 2429 $placeholder.attr('placeholder', ''); 2430 } 2431 $detail.fadeIn(); 2432 }); 2433 2434 //inputé¨åãä¸è¨ã§ã¯åä½ããªãã®ã§å¥ã«ä½æ 2435 $('.js-reason-check').find('.iCheck-helper').on('click', function() { 2436 2437 var $detail = $('.js-reason-detail'); 2438 var $other = $('.js-reason-other'); 2439 var reason = parseInt($(this).prev('input[name="reason_radio_required"]:radio').val()); 2440 var $placeholder = $('.js-reason-textarea') 2441 2442 if (reason === 1 || reason === 2) { 2443 $detail.find('strong').text("å·®ãæ¯ããªããã°è©³ããçç±ããèããä¸ãã"); 2444 $other.css('display', 'none') 2445 $placeholder.attr('placeholder', ''); 2446 } else if (reason === 3) { 2447 $detail.find('strong').text("ã¢ããã¼ã·ã§ã³ãä½ä¸ããã®ã¯ãªãã§ããï¼"); 2448 $other.css('display', 'block') 2449 $placeholder.attr('placeholder', ''); 2450 } else if (reason === 4) { 2451 $detail.find('strong').text("ç°¡åãªæ¥åå 容ã¨å¹´åãå°±è·æ´»åå 容ãæãã¦ä¸ãã"); 2452 $other.css('display', 'block') 2453 $placeholder.attr('placeholder', 'ä¾ï¼ââæ ªå¼ä¼ç¤¾ï¼å¹´å400ä¸ï¼ã¨ÃÃå¶ä½ä¼ç¤¾(å¹´å350ä¸ï¼ãã2020å¹´5æã«å å®ãé ãã¾ãããã¨ã¼ã¸ã§ã³ãã¯ä½¿ç¨ããwantedlyã¨greenãå©ç¨ãã¾ãããæçµçã«ââæ ªå¼ä¼ç¤¾ã«å°±è·ããç¾å¨ã¯Reactãç¨ããããã³ãã¨ã³ãæ¥åã«å¾äºãã¦ãã¾ãã'); 2454 } else if (reason === 5) { 2455 $detail.find('strong').text("ç°¡åãªæ¥åå 容ã¨å¹´åãå°±è·æ´»åå 容ãæãã¦ä¸ãã"); 2456 $other.css('display', 'block') 2457 $placeholder.attr('placeholder', 'ä¾ï¼ââæ ªå¼ä¼ç¤¾ï¼å¹´å400ä¸ï¼ã¨ÃÃæéä¼ç¤¾(å¹´å350ä¸ï¼ãã2020å¹´5æã«å å®ãé ãã¾ãããdodaã¨wantedlyãå©ç¨ãã¾ãããæçµçã«ââæ ªå¼ä¼ç¤¾ã«å°±è·ããç¾å¨ã¯ãã¼ã±ãã£ã³ã°æ¥åã«æºãã£ã¦ãã¾ãã'); 2458 } else if (reason === 6) { 2459 $detail.find('strong').text("ããããäºã¨ã¯ã©ããªãã®ã§ããï¼"); 2460 $other.css('display', 'block') 2461 $placeholder.attr('placeholder', ''); 2462 } else if (reason === 7) { 2463 $detail.find('strong').text("ã©ããªç®æ¨ãéæããã¾ãããï¼"); 2464 $other.css('display', 'block') 2465 $placeholder.attr('placeholder', ''); 2466 } else if (reason === 8) { 2467 $detail.find('strong').text("ããªãã«åããªãã£ãé¨åãæãã¦ä¸ãã"); 2468 $other.css('display', 'block') 2469 $placeholder.attr('placeholder', ''); 2470 } else if (reason === 9) { 2471 $detail.find('strong').text("ã©ã®ã¹ã¯ã¼ã«ã»ãµã¼ãã¹ããå©ç¨äºå®ã§ããï¼"); 2472 $other.css('display', 'block') 2473 $placeholder.attr('placeholder', ''); 2474 } else { 2475 $detail.find('strong').text("詳ããçç±ããèããä¸ãã"); 2476 $other.css('display', 'none') 2477 $placeholder.attr('placeholder', ''); 2478 } 2479 $detail.fadeIn(); 2480 }); 2481 2482 //éä¼ãã©ã¼ã æºè¶³åº¦ã®è©³ç´°ç¨ 2483 $('.js-satisfied-check').on('click', function() { 2484 var unsatisfied = $(this).find('input[name="unsatisfied_radio_required"]:radio').val(); 2485 //æºè¶³åºæ¥ãªãã£ãå ´åã«ã¯ãã®çç±ãèããã©ã¼ã ã表示ãã 2486 if (unsatisfied === 'unsatisfied') { 2487 $('.js-unsatisfied-reason-textarea').prop('required', true); 2488 $('.js-unsatisfied-reason').fadeIn(); 2489 } else { 2490 $('.js-unsatisfied-reason-textarea').prop('required', false); 2491 $('.js-unsatisfied-reason').fadeOut('normal'); 2492 } 2493 }); 2494
2495 //inputé¨åãä¸è¨ã§ã¯åä½ããªãã®ã§å¥ã«ä½æ 2496 $('.js-satisfied-check').find('.iCheck-helper').on('click', function() { 2497 var unsatisfied = $(this).prev('input[name="unsatisfied_radio_required"]:radio').val(); 2498 //æºè¶³åºæ¥ãªãã£ãå ´åã«ã¯ãã®çç±ãèããã©ã¼ã ã表示ãã 2499 if (unsatisfied === 'unsatisfied') { 2500 $('.js-unsatisfied-reason').fadeIn(); 2501 } else { 2502 $('.js-unsatisfied-reason').fadeOut('normal'); 2503 } 2504 }); 2505 2506 ////////////////忥çã¢ã³ã±ã¼ããããã//////////////// 2507 //忥çã¢ã³ã±ã¼ãè©³ç´°ç¨ 2508 //å ¥é¨åçµé¨ 2509 $('.js-grad-experience-check').on('click', function() { 2510 var value = $(this).find('input[name="experience_flg_radio_required"]:radio').val(); 2511 //ã¯ãã®å ´åã«ã¯ãã®çç±ãèããã©ã¼ã ã表示ãã 2512 if (value === 'true') { 2513 $('.js-experience-detail-textarea').prop('required', true); 2514 $('.js-grad-experience-detail').fadeIn(); 2515 } else { 2516 $('.js-experience-detail-textarea').prop('required', false); 2517 $('.js-grad-experience-detail').fadeOut('normal'); 2518 } 2519 }); 2520 2521 //ä»ã®ã¹ã¯ã¼ã«å©ç¨ 2522 $('.js-grad-others-check').on('click', function() { 2523 var value = $(this).find('input[name="others_flg_radio_required"]:radio').val(); 2524 //ã¯ãã®å ´åã«ã¯éãã®æç¡ãèããã©ã¼ã ã表示ãã 2525 if (value === 'true') { 2526 $('.js-grad-difference-input').prop('required', true); 2527 $('.js-grad-difference').fadeIn(); 2528 } else { 2529 $('.js-grad-difference-input').prop('required', false); 2530 $('.js-difference-detail-textarea').prop('required', false); 2531 $('.js-grad-difference').fadeOut('normal'); 2532 $('.js-grad-difference-detail').fadeOut('normal'); 2533 } 2534 }); 2535 2536 //ä»ã®ã¹ã¯ã¼ã«ã¨ã®éã 2537 $('.js-grad-difference-check').on('click', function() { 2538 var value = $(this).find('input[name="difference_flg_radio"]:radio').val(); 2539 //ã¯ãã®å ´åã«ã¯ãã®çç±ãèããã©ã¼ã ã表示ãã 2540 if (value === 'true') { 2541 $('.js-difference-detail-textarea').prop('required', true); 2542 $('.js-grad-difference-detail').fadeIn(); 2543 } else { 2544 $('.js-difference-detail-textarea').prop('required', false); 2545 $('.js-grad-difference-detail').fadeOut('normal'); 2546 } 2547 }); 2548 2549 //åæ¥è©¦é¨ãåãã¦è¯ãã£ãã 2550 $('.js-grad-exam-check').on('click', function() { 2551 var value = $(this).find('input[name="exam_impression_flg_radio_required"]:radio').val(); 2552 console.log(value); 2553 //ã¯ãã®å ´åã«ã¯å§ãããæç¡ãèããã©ã¼ã ã表示ãã 2554 if (value === 'true') { 2555 $('.js-grad-exam-input').prop('required', true); 2556 $('.js-grad-exam').fadeIn(); 2557 } else { 2558 $('.js-grad-exam-input').prop('required', false); 2559 $('.js-grad-exam').fadeOut('normal'); 2560 } 2561 }); 2562 2563 //転è·ã®æç¡ 2564 $('.js-grad-job-change-check').on('click', function() { 2565 var value = $(this).find('input[name="job_change_flg_radio_required"]:radio').val(); 2566 //ã¯ãã®å ´åã«ã¯å½¹ã«ç«ã£ãæç¡ãèããã©ã¼ã ã表示ãã 2567 //転è·ã®è©³ç´°ãèããã©ã¼ã ã追å 2568 if (value === 'true') { 2569 $('.js-grad-useful-input').prop('required', true); 2570 $('.js-grad-useful').fadeIn(); 2571 $('.js-job-detail-textarea').prop('required', true); 2572 $('.js-job-detail').fadeIn(); 2573 } else { 2574 $('.js-grad-useful-input').prop('required', false); 2575 $('.js-useful-textarea').prop('required', false); 2576 $('.js-grad-useful').fadeOut('normal'); 2577 $('.js-grad-useful-detail').fadeOut('normal'); 2578 $('.js-job-detail-textarea').prop('required', false); 2579 $('.js-job-detail').fadeOut('normal'); 2580 } 2581 }); 2582 2583 //å½¹ã«ç«ã£ããã©ãã 2584 $('.js-grad-useful-check').on('click', function() { 2585 var value = $(this).find('input[name="useful_flg_radio"]:radio').val(); 2586 //ã¯ãã®å ´åã«ã¯ãã®çç±ãèããã©ã¼ã ã表示ãã 2587 if (value === 'true') { 2588 $('.js-useful-detail-textarea').prop('required', true); 2589 $('.js-grad-useful-detail').fadeIn(); 2590 } else { 2591 $('.js-useful-detail-textarea').prop('required', false); 2592 $('.js-grad-useful-detail').fadeOut('normal'); 2593 } 2594 }); 2595
2596 //inputé¨åãä¸è¨ã§ã¯åä½ããªãã®ã§å¥ã«ä½æ 2597 //å ¥é¨åçµé¨ 2598 $('.js-grad-experience-check').find('.iCheck-helper').on('click', function() { 2599 var value = $(this).prev('input[name="experience_flg_radio_required"]:radio').val(); 2600 //ã¯ãã®å ´åã«ã¯ãã®çç±ãèããã©ã¼ã ã表示ãã 2601 if (value === 'true') { 2602 $('.js-experience-detail-textarea').prop('required', true); 2603 $('.js-grad-experience-detail').fadeIn(); 2604 } else { 2605 $('.js-experience-detail-textarea').prop('required', false); 2606 $('.js-grad-experience-detail').fadeOut('normal'); 2607 } 2608 }); 2609 2610 //ä»ã®ã¹ã¯ã¼ã«å©ç¨ 2611 $('.js-grad-others-check').find('.iCheck-helper').on('click', function() { 2612 var value = $(this).prev('input[name="others_flg_radio_required"]:radio').val(); 2613 //ã¯ãã®å ´åã«ã¯éãã®æç¡ãèããã©ã¼ã ã表示ãã 2614 if (value === 'true') { 2615 $('.js-grad-difference-input').prop('required', true); 2616 $('.js-grad-difference').fadeIn(); 2617 } else { 2618 $('.js-grad-difference-input').prop('required', false); 2619 $('.js-difference-detail-textarea').prop('required', false); 2620 $('.js-grad-difference').fadeOut('normal'); 2621 $('.js-grad-difference-detail').fadeOut('normal'); 2622 } 2623 }); 2624 2625 //ä»ã®ã¹ã¯ã¼ã«ã¨ã®éã 2626 $('.js-grad-difference-check').find('.iCheck-helper').on('click', function() { 2627 var value = $(this).prev('input[name="difference_flg_radio"]:radio').val(); 2628 //ã¯ãã®å ´åã«ã¯ãã®çç±ãèããã©ã¼ã ã表示ãã 2629 if (value === 'true') { 2630 $('.js-difference-detail-textarea').prop('required', true); 2631 $('.js-grad-difference-detail').fadeIn(); 2632 } else { 2633 $('.js-difference-detail-textarea').prop('required', false); 2634 $('.js-grad-difference-detail').fadeOut('normal'); 2635 } 2636 }); 2637 2638 //åæ¥è©¦é¨ãåãã¦è¯ãã£ãã 2639 $('.js-grad-exam-check').find('.iCheck-helper').on('click', function() { 2640 var value = $(this).prev('input[name="exam_impression_flg_radio_required"]:radio').val(); 2641 //ã¯ãã®å ´åã«ã¯å§ãããæç¡ãèããã©ã¼ã ã表示ãã 2642 if (value === 'true') { 2643 $('.js-grad-exam-input').prop('required', true); 2644 $('.js-grad-exam').fadeIn(); 2645 } else { 2646 $('.js-grad-exam-input').prop('required', false); 2647 $('.js-grad-exam').fadeOut('normal'); 2648 } 2649 }); 2650 2651 //転è·ã®æç¡ 2652 $('.js-grad-job-change-check').find('.iCheck-helper').on('click', function() { 2653 var value = $(this).prev('input[name="job_change_flg_radio_required"]:radio').val(); 2654 //ã¯ãã®å ´åã«ã¯å½¹ã«ç«ã£ãæç¡ãèããã©ã¼ã ã表示ãã 2655 //転è·ã®è©³ç´°ãèããã©ã¼ã ã追å 2656 if (value === 'true') { 2657 $('.js-grad-useful-input').prop('required', true); 2658 $('.js-grad-useful').fadeIn(); 2659 $('.js-job-detail-textarea').prop('required', true); 2660 $('.js-job-detail').fadeIn(); 2661 } else { 2662 $('.js-grad-useful-input').prop('required', false); 2663 $('.js-useful-textarea').prop('required', false); 2664 $('.js-grad-useful').fadeOut('normal'); 2665 $('.js-grad-useful-detail').fadeOut('normal'); 2666 $('.js-job-detail-textarea').prop('required', false); 2667 $('.js-job-detail').fadeOut('normal'); 2668 } 2669 }); 2670 2671 //å½¹ã«ç«ã£ããã©ãã 2672 $('.js-grad-useful-check').find('.iCheck-helper').on('click', function() { 2673 var value = $(this).prev('input[name="useful_flg_radio"]:radio').val(); 2674 //ã¯ãã®å ´åã«ã¯ãã®çç±ãèããã©ã¼ã ã表示ãã 2675 if (value === 'true') { 2676 $('.js-useful-detail-textarea').prop('required', true); 2677 $('.js-grad-useful-detail').fadeIn(); 2678 } else { 2679 $('.js-useful-detail-textarea').prop('required', false); 2680 $('.js-grad-useful-detail').fadeOut('normal'); 2681 } 2682 }); 2683 2684 //5段éè©ä¾¡ 2685 $('.js-grad-star-item').on('click', function() { 2686 var index = $(this).index(); 2687 var target = index + 1; 2688 console.log(target); 2689 $('.js-grad-star li:lt(' + target + ')').addClass('active'); 2690 $('.js-grad-star li:gt(' + index + ')').removeClass('active'); 2691 $('.js-grad-star-form').val(target); 2692 2693 2694 }); 2695 ////////////////忥çã¢ã³ã±ã¼ãããã¾ã§//////////////// 2696 2697 ////////////////ãªãã¥ã¼ã¢ã«ããããããã¼ã¸é¢é£//////////////// 2698 // ãã°ã¤ã³/ã¢ã«ã¦ã³ã使ãã©ã¼ã ã®ã¿ãã®åãæ¿ã 2699 2700 //ãã³ãã¼ã¬ã¼ã¡ãã¥ã¼ã®ã¯ãªã㯠2701 // SPã¡ãã¥ã¼ 2702 $('.js-toggle-sp-menu').on('click', function() { 2703 $(this).toggleClass('active'); 2704 $('html').toggleClass('is-fixed'); 2705 $('body').toggleClass('is-fixed'); 2706 $('.js-toggle-sp-menu-target').toggleClass('active'); 2707 }); 2708 $('.js-toggle-sp-menu-list').children('li').children('a').on('click', function() { 2709 $(this).toggleClass('active'); 2710 $('html').toggleClass('is-fixed'); 2711 $('body').toggleClass('is-fixed'); 2712 $('.js-toggle-sp-menu-target').toggleClass('active'); 2713 }); 2714 }); 2715 //ãã¼ãã£ã³ã° 2716 $(window).on('load', function() { 2717 $("#loading").fadeOut(); 2718 }); 2719 2720</script>
2720 2721<!-- Twitter universal website tag code -->
2722<script> 2723!function(e,t,n,s,u,a){e.twq||(s=e.twq=function(){s.exe?s.exe.apply(s,arguments):s.queue.push(arguments); 2724},s.version='1.1',s.queue=[],u=t.createElement(n),u.async=!0,u.src='//static.ads-twitter.com/uwt.js', 2725a=t.getElementsByTagName(n)[0],a.parentNode.insertBefore(u,a))}(window,document,'script'); 2726// Insert Twitter Pixel ID and Standard Event data below 2727twq('init','o2awi'); 2728twq('track','PageView'); 2729</script>
2729 2730<!-- End Twitter universal website tag code --> 2731 2732</body> 2733 2734</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.