software_development:html_css_javascript

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revision Previous revision
Next revision
Previous revision
software_development:html_css_javascript [2019/03/28 05:23] – [Image resize - area map] prgramsoftware_development:html_css_javascript [2025/07/07 14:12] (current) – external edit 127.0.0.1
Line 4: Line 4:
  
 [[https://www.w3schools.com/|https://www.w3schools.com/]] [[https://www.w3schools.com/|https://www.w3schools.com/]]
 +
 +==== 계정 ====
 +https://www.hostmeca.com/
 +https://domain.ksidc.net/
 +
 +
 +==== Location ====
 +<code javascript>
 +location.hash ="#n"
 +$(location).attr('hash')
 +</code>
 +==== List, Dictionary ====
 +<code javascript>
 +prod = { "key":"value" };
 +for (var key in prod) {
 +  key
 +  prod[key]
 +}
 +</code>
 +
 +==== CSS Style ====
 +<code javascript>
 +$('#mask').removeClass('active');
 +$('#mark').addClass('active')
 +$('html').css('overflow', 'initial');
 +
 +$(this).attr('id')
 +</code>
 +
 +
 +<code css>
 +@media (min-width: 768px) {
 +  /* wide mode css */
 +  .classname {
 +    attr : value !important; /* override */
 +  }
 +}
 +</code>
 +==== String ====
 +<code javascript>
 +function comma(str) { // 숫자에 컴마 및 원 붙이기
 +  str = String(str);
 +  return str.replace(/(\d)(?=(?:\d{3})+(?!\d))/g, '$1,') + "원";
 +}
 +</code>
 +
 +==== resize ====
 +<code javascript>
 +$(window).on('resize', function() {
 +  if ($(window).width() >= 768) {
 +    set_tablet_mode();
 +    status = "t";
 +  } else {
 +    status = "m";
 +  }
 +});
 +</code>
 +==== disable Telephone Link on Desktop ====
 +
 +
 +
 +[[https://jsfiddle.net/az96o8Ly/|https://jsfiddle.net/az96o8Ly/]]
 +
 +<code javascript>
 +// Use event delegation, to catch clicks on links that may be added by javascript at any time.
 +jQuery(document.documentElement).on('click', '[href^="tel:"]', function(e){
 +  try{
 +    // These user-agents probably support making calls natively.
 +    if( /Android|webOS|iPhone|iPad|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {
 +   // Do nothing; This device probably supports making phone calls natively...
 +    } else {
 +      // Extract the phone number.
 +      var phoneNumber = jQuery(this).attr('href').replace('tel:', '').trim();
 +
 +      // Tell the user to call it.
 +      alert("Please call "+phoneNumber);
 +
 +      // Prevent the browser popup about unknown protocol tel:
 +      e.preventDefault();
 +      e.stopPropagation();
 +    }
 +  } catch(e){
 +    console.log("Exception when catching telephone call click!", e);
 +  }
 +});
 +</code>
  
 ==== Image resize - area map ==== ==== Image resize - area map ====
Line 9: Line 95:
 [[https://github.com/stowball/jQuery-rwdImageMaps|https://github.com/stowball/jQuery-rwdImageMaps]] [[https://github.com/stowball/jQuery-rwdImageMaps|https://github.com/stowball/jQuery-rwdImageMaps]]
  
-<code html4strict>+<code html>
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
 <script src="https://mattstow.com/experiment/responsive-image-maps/jquery.rwdImageMaps.min.js"></script> <script src="https://mattstow.com/experiment/responsive-image-maps/jquery.rwdImageMaps.min.js"></script>
Line 23: Line 109:
 </script> </script>
 </code> </code>
- 
  
 ==== Page onload ==== ==== Page onload ====
Line 45: Line 130:
   * for each 보다 index 이용이 더 빠름 (Table Rendering이 느림..)   * for each 보다 index 이용이 더 빠름 (Table Rendering이 느림..)
  
-==== Overflow - ellipsis ====+==== Overflow (말줄임표) - ellipsis ====
  
   * [[http://rabbitchris.tistory.com/431|http://rabbitchris.tistory.com/431]]   * [[http://rabbitchris.tistory.com/431|http://rabbitchris.tistory.com/431]]
 +
 +==== 통신사/Device 찾기 ====
 +<code javascript>
 +// 홈페이지_기업_인트렌치컨설팅_통신사확인_태그
 +
 +<script>
 +
 +  var transactionXmlHttpRequest;
 +  var itemXmlHttpRequest;
 +  var telecomType;
 +
 +
 +  if (window.XMLHttpRequest)
 +  {
 +    // code for modern browsers
 +    transactionXmlHttpRequest = new XMLHttpRequest();
 +    itemXmlHttpRequest = new XMLHttpRequest();
 +
 +  } else {
 +    // code for IE6, IE5
 +    transactionXmlHttpRequest = new ActiveXObject('Microsoft.XMLHTTP');
 +    itemXmlHttpRequest = new ActiveXObject('Microsoft.XMLHTTP');
 +  }
 +
 +  // 서버 연결
 +  transactionXmlHttpRequest.open('POST', 'http://ip-api.com/json', true);
 +  // 데이터 전송
 +  transactionXmlHttpRequest.send(encodeURI(""));
 +
 +
 +  transactionXmlHttpRequest.onreadystatechange = function() {
 +
 +    if (transactionXmlHttpRequest.readyState == 4 && transactionXmlHttpRequest.status == 200) 
 +    {
 +      telecomType = JSON.parse(this.responseText);
 +
 +      //console.log( "Telecom Type : "+telecomType.isp );  
 +
 +      //return telecomType.isp;
 +    }
 +  };
 +
 +</script>
 +
 +
 +
 +
 +
 +// 맞춤 자바스크립트  수정
 +
 +function(){
 +     return telecomType.isp;
 +}
 +
 +
 +
 +
 +
 +function(){
 +    var pc_device = "win16|win32|win64|mac|macintel";  // 디바이스 종류 설정
 +    var this_device = navigator.platform;  // 접속한 디바이스 환경
 +
 +    if( pc_device.indexOf(navigator.platform.toLowerCase()) < 0 ){
 +        return "MO"
 +    }else{
 +        return "PC"
 +    }
 +}
 +
 +</code>
 +
 +
 +==== 웹 폰트 사용 (나눔고딕) ====
 +https://www.letmecompile.com/%EB%82%98%EB%88%94%EA%B3%A0%EB%94%95-%EA%B5%AC%EA%B8%80-%EC%9B%B9%ED%8F%B0%ED%8A%B8webfont-%EC%82%AC%EC%9A%A9%ED%95%98%EA%B8%B0/
  
  
  • software_development/html_css_javascript.1553750608.txt.gz
  • Last modified: 2025/07/07 14:12
  • (external edit)