effect.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" href="effect_css.css" type="text/css">
<!-- <script type="text/javascript" src="js/jquery-1.8.1.min.js"></script> -->
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="effect_script.js"></script>
</head>
<body>
<div id="container">
<h2>텍스트 효과 연습</h2>
<div id="switcher">
<div class="label">글씨 크기 변경</div>
<button id="switcher-default">보통</button>
<button id="switcher-large">크게</button>
<button id="switcher-small">작게</button>
</div>
<div class="speech">
<p>日 국민감독 이와이슌지 “침략과거 잊은 일본, 미쳤다” 소신발언</p>
<p>일본 영화감독 이와이 슌지의 소신 있는 역사인식이 공개됐다.
이와이슌지는 9월 18일 자신의 트위터에 "일본이 그 섬(다오위다오)를 사려는 행위가
얼마나 도발적인지 상대 입장에서 생각해 볼 필요가 있다.
일본은 일찍이 침략전쟁을 일으켰다가 패전했다는 사실을 너무 잊은 채 살고 있다.
그러면서 상대국 잘못만 따지고 있으니 상대국이 분노하는 것은 당연하다"는
멘션을 게재했다.
이에 한 일본 네티즌은 "그럼 중국이나 한국에서 행하고 있는 반일 교육에 대해서
어떻게 생각합니까?"라는 질문을 던졌고 이와이슌지 감독은
"'일본은 주변 국가를 침략하려다 미국에게 패전한 나라다.
하지만 면책받았다. 침략당한 나라가 아직 분노하는 것은 당연하며
잊어버리고 있는 일본이 미친 것이다'는 것이 저의 역사인식입니다"라고 답하며
냉철한 입장에서 일본의 역사인식을 꼬집었다.</p>
<a href="#" class="more">Read More</a>
<p>이어 이와이슌지는 "현재 일본 언론은 주변 국가를 너무 나쁘게 말하고 있다.
자신의 부모나 조국을 나쁘게 말하면 불쾌해진다는 것은 어린아이도 다 아는 사실이다.
일본을 좋아하는 많은 아시아인들이 일본을 방문해 주고 있다.
이런 고마운 일 앞에 우리는 자신을 되짚어 볼 필요가 있다",
"자국주의에 치우친 편협한 역사해석은 인간적으로 받아들이기 어렵다",
"편협하고 모자란 애국론은 일본에 독이 될 뿐이다"라고 연이어 멘션을 게재하며
역사인식에 대한 자신의 소신을 굽히지 않았다.
한편 이와이슌지의 역사인식을 접한 한 한국인 네티즌은 이와이슌지의 트위터에
"저는 한국에서 태어나 자랐으며 현재 일본에서 일하고 있는 한국인입니다.
정치나 역사 문제에 대해 이야기하는 것을 좋아하진 않지만
어떻게든 한마디 하고 싶어서 리트윗합니다. 전 모국인 한국을 당연히 사랑합니다.
하지만 한국의 정부는 좋아하지 않습니다"라고 댓글을 게재하며
한국 정부에 대한 불만을 드러냈다.
이에 이와이슌지는 "현재 일본 정부도 안타깝기는 마찬가지입니다.
이런 정부를 가진 국민이 피해자일 뿐이죠. 이럴 때일수록 국경을 넘어
같은 마음으의 친구가 연대해 지금의 평화를 지켜야 한다고 생각합니다"라고 답하며
의견을 나눴다.
연예인 남희석은 이와이슌지 감독의 역사인식 발언을 해석본과 함께 리트윗하며
그의 소신을 칭찬하기도 했다.
<br/><br/>
한일 관계가 급속도로 냉랭해진 상황이다.
일본은 우리는 물론 중국과도 영토분쟁을 겪고 있다.
반면 일본 내 우익세력들의 위세는 점점 더 거세지고 있다.
민감한 역사문제를 두고 지금 같은 상황에 소신있게 자신의 역사인식을 밝힌
이와이슌지 감독이 더 대단해 보이는 이유다.
한편 이와이슌지 감독의 역사인식 발언을 접한
한국 네티즌들은 "옳고 그름을 떠나서 자신의 생각을 당당하게 밝힌 것만으로도 대단하다",
"생각이 참 깊은 사람", "당신 영화 좋아합니다", "멋지다" 등 긍정적인 반응을 쏟아냈다.
이와이슌지 감독은 국내에 영화 '러브레터'로 잘 알려졌다.
대표작으로는 '하나와앨리스', '4월 이야기' 등이 있으며 다작을 하면서도
특유의 맑은 감성을 담아낸 연출로 일본에서 국민감독의 칭호를 얻고 있다.
최근에는 미국 으로까지 활동영역을 넓히고 있다.</p>
</div>
</div>
</body>
</html>
effect_css.css
#container {
font-size: 1.2em;
margin: 10px 2em;
}
h2 {
font-size: 1.3em;
margin-bottom: 0.5em;
}
.hover {
cursor: pointer;
background: #ffffaa;
}
.label {
width: 130px;
margin: 0.5em 0px;
}
effect_script.js
$(document).ready(function() {
var speech = $("div.speech");
var defaultSize = speech.css("fontSize"); // 폰트 크기 얻기
//alert(defaultSize);
$('#switcher button').click(function() {
// 십진수로 숫자만 얻음(px 제거)
var num = parseFloat(speech.css('fontSize'), 10);
//alert(num);
switch(this.id) {
case 'switcher-large' :
num += 8;
break;
case 'switcher-small' :
num -= 8;
break;
default:
num = parseFloat(defaultSize, 10);
break;
}
// speech.animate({ fontSize: num+'px' }, 'slow'); // 반대로 'fast'가 있다.
// speech.animate({ fontSize: num+'px' }, 'fast'); // 반대로 'slow'가 있다.
speech.animate({ fontSize: num+'px' }, 1000);
// 적은 숫자일수록 빠르다. 초를 나타내는 듯. 속도 조절이 가능하다.
});
// 문서의 일부 보이기/숨기기
var firstPara = $("p:eq(2)");
firstPara.hide();
$('a.more').click(function() {
// 해당 문서가 안 보일 경우
if (firstPara.is(":hidden")) {
// firstPara.slideToggle("slow"); // fast?
firstPara.fadeIn("slow");
$(this).text("Read Less");
}
// 해당 문서가 보일 경우
else {
// firstPara.slideToggle("slow");
firstPara.fadeOut("slow");
$(this).text("Read More");
}
});
$("h2, button, div.label, span.more").hover(
function() {
$(this).addClass('hover');
},
function() {
$(this).removeClass('hover');
}
);
});
'Study > HTML5,CSS,JQuery' 카테고리의 다른 글
| [HTML5/CSS3/JQUERY] table : 테이블 example (0) | 2019.05.27 |
|---|---|
| [HTML5/CSS3/JQUERY] menu : 메뉴 example (0) | 2019.05.22 |
| [HTML5/CSS3/JQUERY] event : 이벤트 example (0) | 2019.05.22 |
| [HTML5/CSS3/JQUERY] selector (0) | 2019.05.22 |
| [HTML5/CSS3/JQUERY] web sql database (0) | 2019.05.22 |
