๋ณธ๋ฌธ ๋ฐ”๋กœ๊ฐ€๊ธฐ

์ œ์ด์ฟผ๋ฆฌ3

'์ œ์ด์ฟผ๋ฆฌ toggle()์ด์šฉํ•ด์„œ ๊ฒŒ์‹œ๋ฌผ ๋ชฉ๋ก ์ •๋ ฌ ๋ฒ„ํŠผ ํ† ๊ธ€ํ•˜๊ธฐ ๊ฒŒ์‹œ๋ฌผ ๋ชฉ๋ก์„ ์ œ๋ชฉ, ํ˜น์€ ์กฐํšŒ์ˆ˜, ๊ฒŒ์‹œ์ผ ์ˆœ์„œ๋ฅผ ๋‚ด๋ฆผ์ฐจ์ˆœ ํ˜น์€ ์˜ค๋ฆ„ ์ฐจ์ˆœ์œผ๋กœ ์ •๋ ฌํ•˜๋Š” ๊ฒƒ์„ ํ† ๊ธ€ํ•ด์•ผํ•  ๋•Œ๊ฐ€ ์žˆ์ฃ . ๋ฌผ๋ก  ๊ฒŒ์‹œ๋ฌผ์˜ ์ˆœ์„œ๋Š” ๊ฐœ๋ฐœํŒ€์—์„œ ์†ŒํŒ…์„ ํ•ด์ฃผ์–ด์•ผ๊ฒ ์ง€๋งŒ, ์ผ๋‹จ์€ UI์ƒ์—์„œ ๋ฒ„ํŠผ์˜ ํ™”์‚ดํ‘œ๋กœ ์ง๊ด€์ ์œผ๋กœ ์˜ค๋ฆ„์ฐจ์ˆœ ๋˜๋Š” ๋‚ด๋ฆผ์ฐจ์ˆœ์„ ํด๋ฆญ ํšŸ์ˆ˜์— ๋”ฐ๋ผ ํ† ๊ธ€ํ•ด์ฃผ์–ด์•ผ ํ•  ํ•„์š”๊ฐ€ ์žˆ์Šต๋‹ˆ๋‹ค. ์•„ ๋ฌผ๋ก  ๋ฐ์ดํ„ฐ์˜ ์†ŒํŒ…๊นŒ์ง€ ํ•˜๋Š” ์†Œ์Šค๋Š” ์•„๋‹™๋‹ˆ๋‹ค.์ด ๊ธ€์—์„œ์˜ ๋ชฉ์ ์€ ๋‹จ์ง€ ํ† ๊ธ€ ๋ฒ„ํŠผ์„ ๊ฐ„๋‹จํ•˜๊ฒŒ ๊ตฌํ˜„ํ•˜๋Š” ์ œ์ด์ฟผ๋ฆฌ ์†Œ์Šค ์†Œ๊ฐœ์ž…๋‹ˆ๋‹ค.์ด๋Ÿด ๋•Œ ์ œ์ด์ฟผ๋ฆฌ(jquery)๋ฅผ ์“ฐ๋ฉด ๊ฐ„๋‹จํ•˜๊ฒŒ ์ฒ˜๋ฆฌ๊ฐ€ ๋˜๊ฒ ์ฃ . Demo Page๋ณด๊ธฐCSS .bd00Bbs th a { background:url(../image/common/ico/arrow_0.gif) 100% 50% no-repeat; padding-right:16px; display.. 2020. 6. 8.
โœˆ ์ œ์ด์ฟผ๋ฆฌ ์ฒดํฌ๋ฐ•์Šค ์ฒดํฌ ์—ฌ๋ถ€ ํ™•์ธ ๋ฐ ์ œ์–ด jquery checkbox checked ์ œ์ด์ฟผ๋ฆฌ ์ฒดํฌ๋ฐ•์Šค ์ฒดํฌ ์—ฌ๋ถ€ ํ™•์ธ ๋ฐ ์ œ์–ด jquery checkbox checked ์ œ์ด์ฟผ๋ฆฌ ์ฒดํฌ๋ฐ•์Šค checked ์—ฌ๋ถ€ ํ™•์ธ $("input:checkbox[id='ID']").is(":checked") == true : false /* by ID */ $("input:checkbox[name='NAME']").is(":checked") == true : false /* by NAME */ checked/unchecked ์ฒ˜๋ฆฌ $("input:checkbox[id='ID']").prop("checked", true); /* by ID */ $("input:checkbox[name='NAME']").prop("checked", false); /* by NAME */ ์ „์ฒด์„ ํƒ ์ฒดํฌ๋ฐ•์Šค๋ฅผ ์„ ํƒํ•˜๋ฉด ๊ทธ ์•„๋ž˜.. 2020. 2. 14.
โœˆjquery hover function ์‚ฌ์šฉ ์˜ˆ ์ œ์ด์ฟผ๋ฆฌ ์ด๋ฒคํŠธ ์ค‘์—์„œ ๊ฝค ํ”ํ•˜๊ฒŒ ์‚ฌ์šฉ๋˜๋Š” ์ด๋ฒคํŠธ ๋ฉ”์†Œ๋“œ๊ฐ€ ๋ฐ”๋กœ hover๋‹ค. ํŠน์ • ์—˜๋Ÿฌ๋จผํŠธ ์œ„์— ๋งˆ์šฐ์Šค๊ฐ€ ์œ„์น˜ํ•˜๊ฑฐ๋‚˜ ๋ฒ—์–ด๋‚ฌ์„ ๋•Œ์˜ ์ด๋ฒคํŠธ๋ฅผ ์ •์˜ํ•œ๋‹ค. ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ์˜ mouseenter, mouserover๋ฅผ ํ•œ ๋ฒˆ์— ์ œ์–ดํ•  ์ˆ˜ ์žˆ๋‹ค. CSS์˜ :hover ์„ ํƒ์ž๋ฅผ ์ด์šฉํ•œ ๊ฒƒ๊ณผ ๊ฐ™์€ ์ด๋ฒคํŠธ๋ฅผ ํƒ€๊ธฐ ๋•Œ๋ฌธ์—, ํ‚ค๋ณด๋“œ๋กœ ์•ต์ปค์— ์œ„์น˜ํ–ˆ์„ ๋•Œ๋Š” ๋™์ž‘ํ•˜์ง€ ์•Š๋Š”๋‹ค. jquery hover function ์‚ฌ์šฉ ์˜ˆ $(document).ready(function(){ //2depth menu showing when menu is collapsed var hoverMenu = $('.lnb .lnb1depth >li'); hoverMenu.hover( function () { var menuInitH = $('#menu.. 2019. 7. 25.