[javascript] 이미지 중앙 정렬 및 alt 표출

[javascript] 이미지 중앙 정렬 및 alt 표출

마크다운 이미지 생성시 alt 속성 값을 줄 수 있다.

![alt 속성 값](이미지 경로)

HTML로 변환하였을 경우 alt 는 이미지가 없는 경우에만 나오므로 평소에는 보이지 않는다.

이미지들을 모두 중앙 정렬 하면서, alt 속성이 밑에 보이도록 하는 코드를 추가한다.

jquery는 추가 되어 있는 상황입니다.

<script>
  $(function(){    
    showAlt();
  });

  function showAlt() {   
    $('p>img').not('[id^="ccl"]').each(function(){
    $(this).css("display", "block");
    $(this).css("margin", "auto");
    var alt = $(this).attr('alt');
    if (alt != "" && alt != undefined && alt != '신고'){           
       var span = "<span class='caption'>"+alt+"</span>";
      $(this).after(span);
    }
    });
  }
</script>

img 태그를 찾아서, display:block , margin:auto 속성을 준다. (← 중앙정렬)

Alt 값을 포함하는 span 태그를 생성해서 아래에 추가한다 (← Alt 표출)