์ „์ฒด ๊ธ€

๐Ÿ‘ฉ‍๐Ÿ’ป java, mysql, android, php, javascript๋ฅผ ๋‹ค๋ฃน๋‹ˆ๋‹ค
์„œ๋ฒ„๋ž€?์œ ์ €๊ฐ€ ๋ฐ์ดํ„ฐ๋‹ฌ๋ผ๊ณ  ์š”์ฒญ์„ ํ•˜๋ฉด ๋ฐ์ดํ„ฐ๋ฅผ ๋ณด๋‚ด์ฃผ๋Š” ๊ฐ„๋‹จํ•œ ํ”„๋กœ๊ทธ๋žจ ์„œ๋ฒ„์— ๋ฐ์ดํ„ฐ๋ฅผ ์š”์ฒญํ•  ๋•Œ๋Š” 1. ์–ด๋–ค ๋ฐ์ดํ„ฐ์ธ์ง€ url๋กœ ์ž˜ ๊ธฐ์žฌํ•ด์•ผํ•˜๊ณ  2. ์–ด๋–ค ๋ฐฉ๋ฒ•์œผ๋กœ ์š”์ฒญํ• ์ง€ ๊ฒฐ์ •ํ•ด์•ผ (GET/POST ๋“ฑ)๋ฐ์ดํ„ฐ๋ฅผ ๋ณด๋‚ด์•ผํ•จ (GET์š”์ฒญ์€ ์„œ๋ฒ„์— ์žˆ๋˜ ๋ฐ์ดํ„ฐ๋ฅผ ์ฝ๊ณ ์‹ถ์„ ๋•Œ ์ฃผ๋กœ ์‚ฌ์šฉ, POST์š”์ฒญ์€ ์„œ๋ฒ„๋กœ ๋ฐ์ดํ„ฐ๋ฅผ ๋ณด๋‚ด๊ณ  ์‹ถ์„ ๋•Œ ์‚ฌ์šฉ) AJAX๋ž€?์„œ๋ฒ„์— GET, POST ์š”์ฒญ์„ ํ•  ๋•Œ ์ƒˆ๋กœ๊ณ ์นจ ์—†์ด ๋ฐ์ดํ„ฐ๋ฅผ ์ฃผ๊ณ ๋ฐ›์„ ์ˆ˜ ์žˆ๊ฒŒ ๋„์™€์ฃผ๋Š” ๊ฐ„๋‹จํ•œ ๋ธŒ๋ผ์šฐ์ € ๊ธฐ๋Šฅ์„ AJAX $.get('https://codingapple1.github.io/hello.txt') .done(function(data){ console.log(data) }) .fail(function(error){ console.log('์‹คํŒจํ•จ')..
์ €๋ฒˆ ๊ฒŒ์‹œ๋ฌผ์—์„œ ์ผ์ผ์ด html ์„ ์ˆ˜์ •ํ•  ์ˆ˜ ์—†๋‹ค๊ณ  ํ–ˆ๋‹ค. ์ด๋ฒˆ์—๋Š” ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋กœ html ๋‹ค๋ฃจ๋Š” ๋ฐฉ๋ฒ•์„ ์•Œ์•„๋ณด๊ฒ ๋‹ค. ์ž์Šค๋กœ html ๋งŒ๋“œ๋Š” ๋ฐฉ๋ฒ•์€ ๋‘๊ฐ€์ง€๊ฐ€ ์žˆ๋‹ค. 1. document.createElement() - document.createElement() ์“ฐ๋ฉด html ์ž๋ฃŒ๋ฅผ ํ•˜๋‚˜ ์ƒ์„ฑํ•ด์ค๋‹ˆ๋‹ค. - ๊ทธ๊ฑธ ๋ง˜๋Œ€๋กœ ์กฐ์ž‘ํ•œ ๋‹ค์Œ appendChild() ์จ์„œ ์•„๋ฌด๋ฐ๋‚˜ ๋„ฃ์œผ๋ฉด html์ด ์ƒ์„ฑ๋จ 2. ๋ฌธ์ž์ž๋ฃŒ๋กœ html์„ ๋งŒ๋“  ๋‹ค์Œ, insertAdjacentHTML() ์•ˆ์— ๋„ฃ๊ธฐ ์ด๊ฒŒ ์ข€๋” ํŽธ๋ฆฌํ•จ. ๋ฒˆ์™ธํŽธ์œผ๋กœ ์ œ์ด์ฟผ๋ฆฌ ๋ฒ„์ „๋„ ์žˆ์Šด ์ œ์ด์ฟผ๋ฆฌ๊ฐ€ ์ œ์ผ ์‰ฌ์šด๋“ฏ? ์ƒํ’ˆ์„ ํƒ ๋ชจ์ž ์…”์ธ  ๋ฐ”์ง€ 95 100 ์ด๊ฑด html์ด๊ณ , ์ด ์œ„์—๋‹ค๊ฐ€ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋กœ element๋ฅผ ์ƒ์„ฑ, ์‚ญ์ œ, ๋ณ€๊ฒฝ ๋“ฑ์„ ํ•ด๋ณด๊ฒ ๋‹ค. //์ž๋ฐ”์Šคํฌ๋ฆฝ..
์›๋ž˜๋Š” ์…”์ธ ์™€ ๋ชจ์ž๊ฐ€ ์žˆ๋Š”๋ฐ, ๊ทธ์ค‘ ์…”์ธ ๋ฅผ ์„ ํƒํ•˜๋ฉด ์‚ฌ์ด์ฆˆ ์˜ต์…˜์ด ๋‚˜์˜ค๋„๋ก ๋งŒ๋“ค๊ฑฐ์ž„. ๋ถ€ํŠธ์ŠคํŠธ๋žฉ์€ ๊ธฐ๋ณธ ์„ค์น˜๋ž˜ 0. ๋จผ์ € html, css๋ฅผ ๋งŒ๋“ค์–ด๋‘”๋‹ค 1. ์…”์ธ ๋ฅผ ์„ ํƒํ•˜๋ฉด ์‚ฌ์ด์ฆˆ ์˜ต์…˜์ด ๋œจ๋„๋ก ๋งŒ๋“ ๋‹ค (๋ฐ˜๋Œ€๋กœ, ๋ฏธ๋ฆฌ form-hide ํด๋ž˜์Šค๋ฅผ ๋ถ€์ฐฉํ•ด๋‘”๋’ค, ํด๋ฆญํ•˜๋ฉด ๋–ผ๋ฒ„๋ฆฌ๋Š” ํ˜•์‹์œผ๋กœ ๋งŒ๋“ค๊ธฐ) ์ƒํ’ˆ์„ ํƒ ๋ชจ์ž ์…”์ธ  95 100 ํ•˜์ง€๋งŒ, ์ด๋Ÿฐ์‹์œผ๋กœ ๋ฏธ๋ฆฌ html, css๋ฅผ ๋งŒ๋“ค์–ด๋†“์œผ๋ฉด ํ™•์žฅ์„ฑ์ด ๋ถ€์กฑํ•˜๋‹ค. ์‹ค์ œ ์‡ผํ•‘๋ชฐ์—์„œ๋Š” ์žฌ๊ณ ๊ฐ€ ์‚ฌ์ด์ฆˆ๋ณ„, ์ƒํ’ˆ๋ณ„ ๋‹ค๋ฅด๊ฒŒ ๋“ค์–ด์˜ค๋Š”๋ฐ, ๋‚ ๋งˆ๋‹ค html ์ฝ”๋“œ๋ฅผ ์ˆ˜์ •ํ•˜๋Š” ๊ฒƒ์€ ๋ถˆ๊ฐ€๋Šฅ. ๋”ฐ๋ผ์„œ, ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋ฅผ ์ด์šฉํ•˜์—ฌ html ์ฝ”๋“œ๋ฅผ ๋งŒ๋“ค์–ด๋ณด๊ฒ ๋‹ค~~ ๋‹ค์Œ๊ฒŒ์‹œ๋ฌผ ํด๋ฆญํ•ด์ฃผ์ƒˆ์—ฌ
0. ๋ถ€ํŠธ์ŠคํŠธ๋žฉํ‹€์„ ๊ฐ€์ ธ์˜จ๋‹ค. 1. ๋ฐ์ดํ„ฐ์— ํ•ด๋‹นํ•˜๋Š” ํ‚ค๊ฐ’์„ (๊ฐ€๊ฒฉ,์ƒํ’ˆ๋ช…๋“ฑ)์„ ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋กœ ์กฐ์ž‘ํ•ด์คŒ 2. ๋ฐฐ์—ด์•ˆ์— ๊ฐ์ฒด๊ฐ€ ์žˆ๋Š” ๊ฒฝ์šฐ์—๋Š”, ๋ฐฐ์—ด์•ˆ์—์„œ ๊ทธ ๊ฐ์ฒด์˜ ์ˆœ์„œ๋ฅผ ๋จผ์ € ์ฐพ๊ณ , ํ‚ค๋ฅผ ์ฐพ๋Š”๋‹ค products[i]['title'] Card title ๊ฐ€๊ฒฉ : 70000 ์ฃผ๋ฌธํ•˜๊ธฐ Card title ๊ฐ€๊ฒฉ : 70000 ์ฃผ๋ฌธํ•˜๊ธฐ Card title ๊ฐ€๊ฒฉ : 70000 ์ฃผ๋ฌธํ•˜๊ธฐ
์ด๋ฒคํŠธ ๋ฒ„๋ธ”๋ง์ด๋ž€? ์ด๋ฒคํŠธ ์ „ํŒŒ ๋ผ๊ณ ๋„ ํ•˜๋ฉฐ, ํ•˜์œ„ํƒœ๊ทธ๋ฅผ ๋ˆ„๋ฅด๋ฉด ์ƒ์œ„ํƒœ๊ทธ๊นŒ์ง€ ์ด๋ฒคํŠธ๊ฐ€ ์ „ํŒŒ๋˜๋Š” ํ˜„์ƒ ๋งˆ์น˜, ๊ฒน์นœ ์ข…์ด์˜ ๊ฐ€์žฅ ๊ฐ€์šด๋ฐ๋ฅผ ๋ˆ„๋ฅธ๊ฒƒ์ฒ˜๋Ÿผ 1. ์ด๋ฒคํŠธ ๋ฒ„๋ธ”๋ง์€ ํ•ญ์ƒ ์ผ์–ด๋‚จ 2. ์ด๋ฒคํŠธ ๊ด€๋ จ ๊ธฐ๋Šฅ๋“ค์„ ์‚ฌ์šฉํ•ด์„œ ํ•ด๊ฒฐํ•  ์ˆ˜ ์žˆ์Œ ๋‹ค์–‘ํ•œ ์ด๋ฒคํŠธํ•จ์ˆ˜๋“ค document.querySelector('.black-bg').addEventListener('click', function(e){ e.target; //์‹ค์ œ ํด๋ฆญํ•œ ์š”์†Œ ์•Œ๋ ค์คŒ (์ด๋ฒคํŠธ ๋ฐœ์ƒํ•œ ๊ณณ) e.currentTarget; //์ง€๊ธˆ ์ด๋ฒคํŠธ๋ฆฌ์Šค๋„ˆ๊ฐ€ ๋‹ฌ๋ฆฐ ๊ณณ ์•Œ๋ ค์คŒ (์ฐธ๊ณ ๋กœ this๋ผ๊ณ  ์จ๋„ ๋˜‘๊ฐ™์Œ) e.preventDefault(); //์‹คํ–‰ํ•˜๋ฉด ์ด๋ฒคํŠธ ๊ธฐ๋ณธ ๋™์ž‘์„ ๋ง‰์•„์คŒ e.stopPropagation(); //์‹คํ–‰ํ•˜๋ฉด ๋‚ด ์ƒ์œ„์š”์†Œ๋กœ์˜ ์ด๋ฒคํŠธ ๋ฒ„๋ธ”๋ง..
ํ—ค๋“œ ์•ˆ์— ์Šคํฌ๋ฆฝํŠธ๋กœ ๋ถ€ํŠธ์ŠคํŠธ๋žฉ ๊น”์•„์ฃผ๊ณ , ์ ๋‹นํ•˜๊ฒŒ ํƒญ๊ธฐ๋Šฅ ํ‹€์„ ๋งŒ๋“ค์–ด์ฃผ์—ˆ๋‹ค ์›ํ•˜๋Š” ๊ฒƒ์€ ํƒญ๋ฒ„ํŠผ์„ ๋ˆŒ๋ €์„๋•Œ ๊ทธ์— ํ•ด๋‹นํ•˜๋Š” ์ฝ˜ํ…์ธ div๊ฐ€ ๋“ฑ์žฅํ•˜๋Š”๊ฒƒ Products Information Shipping ์ƒํ’ˆ์„ค๋ช…์ž…๋‹ˆ๋‹ค. Product ์ŠคํŽ™์„ค๋ช…์ž…๋‹ˆ๋‹ค. Information ๋ฐฐ์†ก์ •๋ณด์ž…๋‹ˆ๋‹ค. Shipping ์ฐจ๊ณก์ฐจ๊ณก ํ•œ๊ธ€๋กœ ์“ด๋’ค ์ฝ”๋“œ๋กœ ๋ฒˆ์—ญํ•ด์ค€๋‹ค //0๋ฒˆ์งธ tab-button๋ถ€ํ„ฐ ๊ธฐ๋Šฅ๊ฐœ๋ฐœ ํ•ด๋ณด์ž /*๋ฒ„ํŠผ 0 ๋ˆ„๋ฅด๋ฉด (์ฝ”๋“œ๋ฅผ ํ•œ์ค„ํ•œ์ค„ ์ฝ์œผ๋‹ˆ๊นŒ ์ œ๊ฑฐ๋จผ์ € ํ•˜๊ณ  ์ถ”๊ฐ€ํ•ด์ฃผ๋Š” ์„ผ์Šค~) - ๋ชจ๋“ ๋ฒ„ํŠผ์— ๋ถ™์€ orange ํด๋ž˜์Šค๋ช… ์ œ๊ฑฐ - ๋ฒ„ํŠผ 0์— orange ํด๋ž˜์Šค๋ช… ์ถ”๊ฐ€ - ๋ชจ๋“  div์— ๋ถ™์€ show ํด๋ž˜์Šค๋ช… ์ œ๊ฑฐ - div0์— show ํด๋ž˜์Šค๋ช… ์ถ”๊ฐ€ */ $('.tab-button').eq(0).on('click',fu..
//์Šคํฌ๋กค๋ฐ” 100px ์ด์ƒ ๋‚ด๋ฆฌ๋ฉด ๋กœ๊ณ ํฐํŠธ์‚ฌ์ด์ฆˆ ์ค„์ด๊ธฐ, ๋‹จ 100px ๋ฏธ๋งŒ์ด๋ฉด ๋‹ค์‹œ ํ‚ค์šฐ๊ธฐ window.addEventListener('scroll',function(){ if(window.scrollY > 100){ $('.navbar-brand').css('font-size','15px'); }else{ $('.navbar-brand').css('font-size','25px'); } }); ์ƒ์ž๋ฐ•์Šค์˜ ์Šคํฌ๋กค์„ ๋‹ค ๋‚ด๋ ธ์„๋•Œ, ์•Œ๋ฆผ์„ ๋„์šฐ๋ ค๋ฉด? Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quae voluptas voluptatum minus praesentium fugit debitis at, laborum ipsa itaque place..
์ด๋ฏธ์ง€ ์Šฌ๋ผ์ด๋“œ ๋งŒ๋“œ๋Š” ์ˆœ์„œ๋Š” ๋‹ค์Œ๊ณผ ๊ฐ™๋‹ค. 1. ๋จผ์ € html ๊ณผ css๋กœ ์ด๋ฏธ์ง€๋ฅผ ๋งŒ๋“ค์–ด์ค€๋‹ค. 2. ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋กœ ๋ฒ„ํŠผ์„ ๋ˆ„๋ฅด๋ฉด ํ™”๋ฉด์ด ์˜ฎ๊ฒจ์ง€๋Š” ๊ธฐ๋Šฅ์„ ์ถ”๊ฐ€ํ•œ๋‹ค ์ฐธ๊ณ ๋กœ, ์•„๋ž˜ ๊ธฐ๋Šฅ์€ ํ™”๋ฉด์ด ํ˜๋Ÿฌ๋„˜์น ๋•Œ ์ž๋™์œผ๋กœ ์ƒ๊ธฐ๋Š” ์Šคํฌ๋กค์„ ์—†์• ์ค€๋‹ค -html 1 2 3 -javascript css ์—์„œ ํด๋ž˜์Šค๋ฅผ ํƒˆ๋ถ€์ฐฉํ•˜๋Š” ๋ฐฉ์‹์œผ๋กœ ํ™”๋ฉด์„ ์ด๋™์‹œํ‚ฌ์ˆ˜๋„ ์žˆ์ง€๋งŒ, ์ด๋™์‹œํ‚ค๋Š” ๊ฐ’ ( 'translateX(-100vw)' => ๊ตต์€๊ธ€์”จ)์„ ํ•ญ์ƒ ๋ณ€ํ™”์‹œํ‚ค๋ ค๊ณ  ํ•˜๊ธฐ ๋•Œ๋ฌธ์— ์ž๋ฐ”์Šคํฌ๋ฆฝํŠธ๋ฅผ ์‚ฌ์šฉํ•ด๋ณด๊ฒ ๋‹ค 100vw๋Š” ํ˜„์žฌ๋ธŒ๋ผ์šฐ์ € ํ™”๋ฉด์ด ๊ฝ‰์ฐฌ ํญ์ด๋‹ค. ๋”ฐ๋ผ์„œ -100vw ๋ฉด ํ˜„์žฌ ํ™”๋ฉด ํญ๋งŒํผ ์™ผ์ชฝ์œผ๋กœ ์ด๋™ํ•œ๋‹ค๋Š” ์˜๋ฏธ์ด๋‹ค //1๋ฒˆ ๋ฒ„ํŠผ ํด๋ฆญ์‹œ 1๋ฒˆ์‚ฌ์ง„์ด ๋ณด์ด๋Š” transform ๊ธฐ๋Šฅ์„ ์ถ”๊ฐ€ํ•ด์ฃผ์„ธ์š” $(".slide-1").on('cli..
becky(์ง€์€)
Know yourself, follow your passion