편집 요약 없음 |
편집 요약 없음 |
||
| 1번째 줄: | 1번째 줄: | ||
$(document).ready(function() { | |||
// 기존의 .custom-toggle 클릭 이벤트 핸들러 | // 기존의 .custom-toggle 클릭 이벤트 핸들러 | ||
$ | $('.custom-toggle').click(function() { | ||
$(this).next('.custom-content').stop(true, true).slideToggle(300); // 300ms 애니메이션 추가 | $(this).next('.custom-content').stop(true, true).slideToggle(300); // 300ms 애니메이션 추가 | ||
}); | }); | ||
// .toggle-collapse 클릭 이벤트 핸들러 수정 | // .toggle-collapse 클릭 이벤트 핸들러 수정 | ||
$ | $('.toggle-collapse').click(function() { | ||
var $this = $(this); | var $this = $(this); | ||
var rowsToToggle = parseInt($this.data('rows')) || 1; | var rowsToToggle = parseInt($this.data('rows')) || 1; | ||
| 14번째 줄: | 14번째 줄: | ||
// 사용자 정의 텍스트 확인 | // 사용자 정의 텍스트 확인 | ||
var expandText = $this.data('expand-text') || '펼치기'; | var expandText = $this.data('expand-text') || '펼치기'; | ||
var collapseText = $this.data('collapse-text') || expandText; | var collapseText = $this.data('collapse-text') || expandText; // 접기 텍스트가 없을 경우 펼치기 텍스트와 동일하게 | ||
// 지정된 행 수만큼 다음 행을 슬라이드 애니메이션으로 표시/숨김 | // 지정된 행 수만큼 다음 행을 슬라이드 애니메이션으로 표시/숨김 | ||
for (var i = 0; i < rowsToToggle; i++) { | for (var i = 0; i < rowsToToggle; i++) { | ||
$row = $row.next(); | $row = $row.next(); | ||
if ($row.length) { | if ($row.length) { // 다음 행이 존재하는지 확인 | ||
$row.stop(true, true).css('display', isCollapsed ? 'none' : 'table-row').animate({ | |||
height: 'toggle', | |||
} | opacity: 'toggle' | ||
}, 300); // 접기 및 펼치기 애니메이션 | |||
} | } | ||
} | } | ||
| 34번째 줄: | 33번째 줄: | ||
// 페이지 로드 시 기본 상태 설정 | // 페이지 로드 시 기본 상태 설정 | ||
$ | $('.toggle-collapse').each(function() { | ||
var $this = $(this); | var $this = $(this); | ||
var rowsToToggle = parseInt($this.data('rows')) || 1; | var rowsToToggle = parseInt($this.data('rows')) || 1; | ||
| 41번째 줄: | 40번째 줄: | ||
// 사용자 정의 텍스트 확인 | // 사용자 정의 텍스트 확인 | ||
var expandText = $this.data('expand-text') || '펼치기'; | var expandText = $this.data('expand-text') || '펼치기'; | ||
var collapseText = $this.data('collapse-text') || expandText; | var collapseText = $this.data('collapse-text') || expandText; // 접기 텍스트가 없을 경우 펼치기 텍스트와 동일하게 | ||
if (isCollapsed) { | if (isCollapsed) { | ||
| 47번째 줄: | 46번째 줄: | ||
for (var i = 0; i < rowsToToggle; i++) { | for (var i = 0; i < rowsToToggle; i++) { | ||
$row = $row.next(); | $row = $row.next(); | ||
if ($row.length) { | if ($row.length) { // 다음 행이 존재하는지 확인 | ||
$row.hide(); // 페이지 로드 시 슬라이드 애니메이션 없이 즉시 숨김 | $row.hide(); // 페이지 로드 시 슬라이드 애니메이션 없이 즉시 숨김 | ||
} | } | ||
| 58번째 줄: | 57번째 줄: | ||
// <nolinkstyle> 태그를 .nolinkstyle 클래스로 변환 | // <nolinkstyle> 태그를 .nolinkstyle 클래스로 변환 | ||
$ | $('nolinkstyle').each(function() { | ||
var $this = $(this); | var $this = $(this); | ||
var content = $this.html(); | var content = $this.html(); | ||
2024년 11월 29일 (금) 10:15 판
$(document).ready(function() {
// 기존의 .custom-toggle 클릭 이벤트 핸들러
$('.custom-toggle').click(function() {
$(this).next('.custom-content').stop(true, true).slideToggle(300); // 300ms 애니메이션 추가
});
// .toggle-collapse 클릭 이벤트 핸들러 수정
$('.toggle-collapse').click(function() {
var $this = $(this);
var rowsToToggle = parseInt($this.data('rows')) || 1;
var isCollapsed = $this.data('collapsed') === true;
var $row = $this.closest('tr');
// 사용자 정의 텍스트 확인
var expandText = $this.data('expand-text') || '펼치기';
var collapseText = $this.data('collapse-text') || expandText; // 접기 텍스트가 없을 경우 펼치기 텍스트와 동일하게
// 지정된 행 수만큼 다음 행을 슬라이드 애니메이션으로 표시/숨김
for (var i = 0; i < rowsToToggle; i++) {
$row = $row.next();
if ($row.length) { // 다음 행이 존재하는지 확인
$row.stop(true, true).css('display', isCollapsed ? 'none' : 'table-row').animate({
height: 'toggle',
opacity: 'toggle'
}, 300); // 접기 및 펼치기 애니메이션
}
}
// 상태 토글
$this.data('collapsed', !isCollapsed);
$this.text($this.data('collapsed') ? expandText : collapseText);
});
// 페이지 로드 시 기본 상태 설정
$('.toggle-collapse').each(function() {
var $this = $(this);
var rowsToToggle = parseInt($this.data('rows')) || 1;
var isCollapsed = $this.data('collapsed') === true;
// 사용자 정의 텍스트 확인
var expandText = $this.data('expand-text') || '펼치기';
var collapseText = $this.data('collapse-text') || expandText; // 접기 텍스트가 없을 경우 펼치기 텍스트와 동일하게
if (isCollapsed) {
var $row = $this.closest('tr');
for (var i = 0; i < rowsToToggle; i++) {
$row = $row.next();
if ($row.length) { // 다음 행이 존재하는지 확인
$row.hide(); // 페이지 로드 시 슬라이드 애니메이션 없이 즉시 숨김
}
}
$this.text(expandText);
} else {
$this.text(collapseText);
}
});
// <nolinkstyle> 태그를 .nolinkstyle 클래스로 변환
$('nolinkstyle').each(function() {
var $this = $(this);
var content = $this.html();
$this.replaceWith('<span class="nolinkstyle">' + content + '</span>');
});
});