Jquery 계속
coda도 zip 여기 들어있으니 잘 찾아봅시다~
| CSS 레이아웃 - Float 속성을 이용한 레이아웃 만들기 (0) | 2011.12.17 |
|---|---|
| Jquery 강좌 (0) | 2011.12.17 |
| ADODB와 쿼리 캐시를 사용 하는 방법? (0) | 2011.12.17 |
| Web Standard Class (0) | 2011.12.15 |
| DOM Event (0) | 2011.12.13 |
<body>body엘레멘트 내부에 두 개의 div 엘레멘트가 들어있습니다. 이 들에는 각각 텍스트로 된 컨텐츠를 포함하고 있지요. 이를 도식으로 나타내면 대략 다음과 같을 겁니다. (정확한 스크린샷이 아닌 도식적으로 나타낸 그림입니다.)
<div id="spDiv">content of DIV whose id is "spDvi"</div>
<div id="norDiv">blah~ blah~ * 100 </div>
</body>
#spDiv{
width:300px;
}
p img{
float:left;
}
#spDiv{이렇게 하면 예상할 수 있듯이 아래와 같은 모양이 될 것입니다. (두번째 div 엘레멘트가 왼쪽으로 좀 삐져나간 것은 애교입니다.) 또한 아래 그림에서 주의할 것은 텍스트가 채운 영역을 표기하기 위해 테두리선을 그렸지만 실제로 두번째 div 엘레멘트의 박스모양은 사각형입니다. float 속성을 첫번째 spDiv에 부여함으로서 두번째 norDiv 엘레멘트는 그 시작점(왼쪽 위 모서리)이 spDiv와 같은 지점이 됩니다.
width:300px;
float:left;
}
#norDiv{
width:500px;
float:right;
}
<body>
<div id="spDiv">content of DIV whose id is "spDvi"</div>
<div id="norDiv">blah~ blah~ * 100 </div>
<div id="thirdDiv">
</body>
#thirdDiv{이제 아래 그림과 같이 각각의 box 엘레멘트들이 얌전히 자기 자리를 찾은 것을 확인할 수 있습니다.
clear:both
}
<body>이 번에는 spDiv와 norDiv를 둘러싸는 wrapper라는 div 태그를 넣었습니다. 두 엘레멘트들의 부모엘레멘트가 되는 셈이지요. 이 wrapper라는 엘레멘트에는 폭과 '배경색'을 넣겠습니다. 어떻게 위치하는지를 살펴볼 속셈이거든요.
<div id="wrapper">
<div id="spDiv">content of DIV whose id is "spDvi"</div>
<div id="norDiv">blah~ blah~ * 100 </div>
</div>
</body>
#wrapper{float으로 떠오른 녀석들은 단순히 아래에 인접한 엘레멘트에만 영향을 미치는 것이 아니라 부모엘레멘트를 완전히 벗어나 버립니다. 아래 그림에서 얇고 노란 박스가 wrapper입니다만, 다른 엘레멘트들은 그 외부로 벗어나와 보입니다.
width:900px;
background-color:#ffffc3; /*노란색입니다*/
}
| Web Standard (5) (0) | 2012.01.17 |
|---|---|
| Jquery 강좌 (0) | 2011.12.17 |
| ADODB와 쿼리 캐시를 사용 하는 방법? (0) | 2011.12.17 |
| Web Standard Class (0) | 2011.12.15 |
| DOM Event (0) | 2011.12.13 |
jQuery 시리즈 강좌 리스트
[jQuery강좌] 1. 웹 개발자를 위한 jQuery 기본이해
[jQuery강좌] 2. jQuery를 이용한 HTML DOM 접근 - 기본 셀렉터 (1)
[jQuery강좌] 3. jQuery를 이용한 HTML DOM 접근 - 기본 셀렉터 (2)
[jQuery강좌] 4. jQuery Selector - 속성(Attribute)
[jQuery강좌] 5. jQuery Selector - DOM 계층(Hierarchy)을 이용한 요소 접근 (1)
[jQuery강좌] 6. jQuery Selector - DOM 계층(Hierarchy)을 이용한 요소 접근 (2)
[jQuery강좌] 7. jQuery Filter - 기본필터(Basic Filter)
[jQuery강좌] 8. jQuery Filter - 폼 필터(Form Filter)
[jQuery강좌] 9. jQuery Filter - 자식필터(Child Filter)
[jQuery강좌] 10. jQuery Traverse - Filtering
[jQuery강좌] 11. jQuery Traverse - Miscellaneous Traversing
[jQuery강좌] 12. jQuery Traverse - Tree Traversal
[jQuery강좌] 13. jQuery Core
[jQuery강좌] 14. jQuery CSS - 스타일 관련 메서드에 대하여
[jQuery강좌] 15. jQuery Attribute - 요소의 속성 관련 메서드에 대하여
[jQuery강좌] 16. jQuery Form API - 폼 지원 메서드에 대하여
[jQuery강좌] 17. jQuery Event - 이벤트 지원 메서드
[jQuery강좌] 18. jQuery Event - bind() 메서드
[jQuery강좌] 19. jQuery Event - 이벤트에 생명을~
[jQuery강좌] 20. jQuery Performance
jQuery 시리즈 동영상 강좌 리스트
[jQuery 동영상 강좌] 1. 웹 개발자를 위한 jQuery 기본이해
| Web Standard (5) (0) | 2012.01.17 |
|---|---|
| CSS 레이아웃 - Float 속성을 이용한 레이아웃 만들기 (0) | 2011.12.17 |
| ADODB와 쿼리 캐시를 사용 하는 방법? (0) | 2011.12.17 |
| Web Standard Class (0) | 2011.12.15 |
| DOM Event (0) | 2011.12.13 |
http://dev.gardenquestions.com/ko/question/how-to-use-query-cache-with-adodb
responsive-web-begin.zip
animation.js$GLOBALS['ADODB_CACHE_DIR']=$_SERVER['DOCUMENT_ROOT'].'/../cache/adodb';이제 캐시 된 결과를 얻을 CacheGetOne 처럼 캐시 * 메서드를 사용할 수 있습니다.
$data = $rs->CacheGetOne($seconds_to_cache, $sql);| CSS 레이아웃 - Float 속성을 이용한 레이아웃 만들기 (0) | 2011.12.17 |
|---|---|
| Jquery 강좌 (0) | 2011.12.17 |
| Web Standard Class (0) | 2011.12.15 |
| DOM Event (0) | 2011.12.13 |
| DOM 기초 (0) | 2011.12.12 |
HTML DOCtype (not HTML5 but XHTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ko" xml:lang="ko">
<head>
<meta name="generator" content="editplus" />
<meta http-equiv="content/type" content="text/html; charset=utf-8"/>
<title> HTML 기본구문 </title>
</head>
<body>
^!
</body>
</html>
HTML주의할 점 몇가지
1) h1 다음에 크기 때문에 h3를 쓰거나 하지 말 것
2) <p/>를 이용해서 칸을 띄우지 말 것
3) a href의 title은 웹표준을 위해서 넣어줘야 하는 것 같다.
a 링크예제
<a href="http://www.daum.net" title="다음포털">다음으로가기 </a>
4) <p id='footer'> 라고 썼었는데 이것도 tag가 생겼대 html5
5) font tag는 이제 없으니까 쓰지 말 것
One page reference
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="ko" xml:lang="ko">
<head>
<meta name="generator" content="editplus" />
<meta http-equiv="content/type" content="text/html; charset=utf-8"/>
<title> HTML 기본구문 </title>
<style type="text/css">
#blank {
height : 1000px;
width : 100px;
}
</style>
</head>
<body>
<a href = "#sometext" id="my_link"> My link </a>
<div id="blank"></div>
<p id="sometext"> The link </p>
<a href="#my_link"> Back to top </a>
</body>
</html>
목록
<dl>
<dt> 타이틀
<dd> 설명 (definition list)
이제는 잘 안쓰인다고 하는군?
HTML기본
1) 인라인 엘리먼트 – Element와 관련된 줄바꿈이 없다! (화면에 출력될 때 줄이 바뀌지 않고 같은 줄에 등장) (<a>, <abbr>, <area>, <audio>, <em>, <strong>, <select>, <span> <label>, <link>, <command>, <nav>, <mark>, <meter>, <time>)
2) 블록 엘리먼트(Block label element) – Element 전, 후에 줄바꿈을 둔다. 각 엘리먼트 위에 세로로 쌓인다. 블록 요소라는 것은 다른 블록 요소를 포함 할 수 있으며, 다른 블록 요소 안으로 들어갈 수 있는 요소를 말한다. (<article>, <aside>, <blockquote>, <body>, <br> ,<button>, <canvas> <header>, <hr>, <object>, <section>, <progress>, <table>, <video>)
HTML에서의 조건 IE 조건부
<!- -[if IE 6]> <link rel=”stylesheet” type=”text/css” href=”ie6style.css” /> <![endif]- -> 조건부 주석은 HTML에만 넣을 수 있지만, 스타일 시트를 IE의 특정 버전에서만 인식하게 하려면 HTML 문서의 head 안에 link요소 앞에 조건부 주석을 넣는다.
- [if IE] – IE5 이상의 모든 버전을 대상으로 한다.
- [if IE 5], [if IE 7]등 - IE라는 글자와 버전 숫자 사이에 빈칸(공백)이 있게. 특정 브라우저 버전 한 개를 대상으로 한다.
- [if gt IE 6] – gt는 초과(greater than)라는 뜻. 이 예는 IE6 초과 버전
- [if gte IE 7] – gte는 이상(greater than or equal)라는 뜻. 이 예는 IE7 이상
- [if lt IE 8]
– lt는 미만(less than)이라는 뜻. 이 예는 IE8 미만 버전을 대상
- [if lte IE 6] – lt는 미만(less than or equal)이라는 뜻. 이 예는 IE6 이하 버전을 대상 ** 딘 에드워드의 IE7과 IE8 (http://code.google.com/p/ie7-js/) 이 라이브러리의 목적은 ‘마이크로소프트 인터넷 익스플로워의 렌더링 기능을 표준 브라우저처럼 만드는 것’이다.
HTML 특수문자들
Character Entity Name Description
" " quotation mark
& & ampersand
< < less-than
> > greater-than
© © copyright
® ® registered trademark ™
™ trademark
× × multiplication
 
Div와 Span 태그의 차이점!
Div는 block tag이고 span은 inline element tag이다. in-line은 줄바뀜 없음.
(머 하지만 id css를 먹일 수 있는 단위이기는 하다)
여러가지 legend같은 input 을 그룹화하는 태그도 있더라
웹표준 문서의 div layout : css-3.html
타이포 관련 CSS
em은 ctrl-+하면 확대되고, px은 확대가 안된다. 절대 크기이다.
그러니까 요즘 웹표준에서는 em으로 많이 사용된다고 한다.
font-family : "Dotum" font-size : em : 12px=1em 2em=24px % : 150%라면
line-height : 해당줄부터 적용
font-weight : 굵기 normal bold 숫자는 의미가 없음font-variant : small caps
text-indent :
text-align : left centervertical-align : 인라인 요소끼리 세로위치를 정렬 (span img a ...) top, middle
text-decoration : 밑줄 취소선등 underline..
letter-spacing :
text-transform : 대소문자
더 많은데...
오 나름 재미있는 모냥새군?
CSS Image요기를 꼭 참고하자.
http://iluku.net/blog/101
color sites
Editor tool
CSS 그룹화
가상클래스 hover 뭐 어쩌구 하는 애들은 가상 클래스
가상요소
선택자
display 요녀석
form에 관련된 이야기
border를 이용해서 debugging을 많이하게 되니까 많은 이용 바랍니다. ^^
<!doctype html>
<html>
<head>
<meta http-equiv='content-type'content='text/html; charset=utf-8' />
<link rel='stylesheet' href='css-2.css' type='text/css'>
</head>
<body>
<div id='content'>
<h1>
그림으로 보는 재미있는 역사이야기
</h1>
<p class='borderTest'>
그림, 한눈에 역사를 통찰하다『역사의 미술관』. 이 책은 서양의 역사화를 주된 소재로, 유명한 역사적 인물이나 흥미로운 역사적 사건과 현상 가운데 그림으로 그려진 사례들을 모아 주제별로 풀어 쓴 것이다. 알렉산드로스, 아우구스투스, 나폴레옹, 루이14세, 스탈린 등 시대를 품에 안았던 인물을 중심으로 그림 속의 역사뿐만 아니라 그림이 그려진 시대 상황까지 아우르며 두 시대의 연관성을 탐색하였다.
</p>
<p>
더불어 역사의 흐름을 바꿔놓은 전염병, 왕들의 처형, 세계대전 등의 피해역사에 대한 이야기와 카리스마, 종교 개혁, 그리스의 지성 등의 키워드를 통해 역사의 흐름 속에서 인간의 이성과 정신의 영역이 어떻게 진보하였는지 그림을 통해 생생하고 창의적으로 보여준다.
</p>
<h2>
다 그림이다 (동서양 미술의 완전한 만남
</h2>
<p>
인간의 가장 기본적인 모습들, 그러나 지금은 돈의 가치에 밀려 잊고 살았던 삶의 조건들 10가지를 선정해, 동서양에서는 그것의 가치를 어떻게 설정하였고, 어떻게 표현했는지 살펴보는 책이 다. 옛 그림에서 지혜를 얻고 동시에 서구식 교육을 받아온 세대들에게 현대적으로 재해석하는 방법을 동시에 제공함으로써, 삶의 가치를 바로 세우는데 균형감을 선사한다.
</p>
</div>
</body>
</html>
<!-- http://lab365.net/demo_source/web_standard/05_background.html -->
body {
background-color : #eee;
margin : 5px;
font-family : '맑은 고딕';
background-image: url('img/bg-03.png');
/* background-repeat : repeat-x;*/
/* repeat이 아무것도 없으면 무한 repeat이 default */
/* background-repeat : repeat-y; */
background-attachment : scroll;
}
div#content {
width : 75%;
margin : 0 auto;
padding : 10px;
border : 1px solid #ccc;
}
.borderTest {
border-width : 2px;
border-style : solid;
border-color : gray;
padding : 5px;
border-radious : 10px;
box-shadow : 5px 5px 10px red;
-moz-border-radius : 10px; /* -moz fire fox 접두사 */
-webkit-border-radious : 10px; /* safari 접두사 */
-moz-box-shadow : 5px 5px 10px #999;
letter-spacing : 0.1em;
line-height : 1em;
text-transform : uppercase;
}
BOX 모델 : MBPC 순서대로 MB네 PC일쎄?
margin : 0 auto; /* 위아래 와 좌우 */
June 10, 2008
relative는 상위요소를 기준으로 상대 위치를 가진다.
absoulte는 절대 위치로서 마치 책에 포스트 잇을 덧붙이듯이 떠있어서 전체화면에서 절대위치를 가진다.
상위 요소에 아무값을 주지 않고 현재 요소에 relative를 주면 상위 요소를 기준으로 위치를 가진다. 하지만 이럴경우 현재 요소가 상위요소에 속해져 있는 상태가 되기 때문에 현재요소의 width 혹은 height만큼 상위요소도 영향을 받게 된다.
하지만 상위요소를 relative를주고 하위요소를 absolute로 정하면 상위요소를 기준으로한 절대위치가 지정된다.
| <!doctype html> | |
| <html lang="ko"> | |
| <head> | |
| <meta charset="utf-8" /> | |
| <link rel="stylesheet" href="../css/layout-01.css" /> | |
| <title>Layout Basci Site</title> | |
| </head> | |
| <body> | |
| <div id="wrap"> | |
| <h1>Web Site Project</h1> | |
| <div class="content"> | |
| <h2>Main Content Heading</h2> | |
| <p>Art Video Blog</p> | |
| </div> | |
| <div id="aside"> | |
| <h2>Sider</h2> | |
| <ul> | |
| <li> | |
| <a href="#">Home</a> | |
| </li> | |
| <li> | |
| <a href="#">About</a> | |
| </li> | |
| <li> | |
| <a href="#">Contact</a> | |
| </li> | |
| </ul> | |
| </div> | |
| <div id="footer"> | |
| <p>Copyright © 2005, Creative Lab365. All rights reserved.</p> | |
| </div> | |
| </div> | |
| </body> | |
</html>/* page Style */
#wrap {
min-width: 600px;
width: 80%;
margin: auto;
background: url(../img/subtle_freckles.png);
font-family: Verdana;
overflow: hidden;
}
#aside, .content {
height: 600px;
}
.content {
background: red;
float: left;
width: 80%;
}
#aside {
background: #fdf2dc;
float: left;
width: 20%
}
#aside ul {
list-style: none;
padding-left: 0;
}
#footer p {
clear: both;
font-size: .75em;
font-variant: small-caps;
text-align: center;
}
/* navigation */
#aside ul {
padding-left: 10px;
line-height: 30px;
list-style: none;
font-variant: small-caps;
}
#aside li a {
text-decoration: none;
color: purple;
}
#aside li a:hover {
font-size: 1.4em;
color: #FF9E00; } |
마진이 합쳐지는 현상이 있다.
(겹침현상) 더 큰 수치의 놈만 설정된다.
div는 margin을 주게 되면 부모와 자식에게 모두 영향을 줘서 같이 margin이 먹는다.
위 파일은 음음 몇가지 수업중 예제이다.
position absolute는 부모로부터 인가?
| Jquery 강좌 (0) | 2011.12.17 |
|---|---|
| ADODB와 쿼리 캐시를 사용 하는 방법? (0) | 2011.12.17 |
| DOM Event (0) | 2011.12.13 |
| DOM 기초 (0) | 2011.12.12 |
| 웹 폰트 web font (0) | 2011.11.21 |
1 /* 공통 CSS */ 2 body{ 3 margin: 0; 4 padding: 0; 5 font-size: 16px; 6 font-family: "굴림", "Times New Roman"; 7 } 8 h1{ 9 margin-top: 10px; 10 margin-left: 40px; 11 font-size: 18px; 12 } 13 #groupOne { 14 margin-top: 20px; 15 margin-left: 40px; 16 } 17 .idcolor { 18 background-color: yellow; 19 }
1 //----------------------------------------------------- 2 // 이벤트 개요 3 //----------------------------------------------------- 4 window.onload = function () { 5 var qtyClick = document.getElementById('qty'); 6 var priceClick = document.getElementById('price'); 7 8 if (qtyClick.addEventListener) { 9 qtyClick.addEventListener('keyup', Show.qty, false); 10 priceClick.addEventListener('keyup', Show.price, false); 11 } else { 12 qtyClick.attachEvent('onkeyup', Show.qty); 13 priceClick.attachEvent('onkeyup', Show.price); 14 } 15 } 16 var Show = { 17 entryQty: 0, 18 entryPrice: 0, 19 qty: function(event) { 20 var clickElement = event.target || event.srcElement; 21 $('show1').innerHTML = Show.entryQty = clickElement.value; 22 Show.amount(); 23 }, 24 price: function(event) { 25 var clickElement = event.target || event.srcElement; 26 $('show2').innerHTML = Show.entryPrice = clickElement.value; 27 Show.amount(); 28 }, 29 amount: function() { 30 $('show3').innerHTML = '금액: ' + Show.entryQty * Show.entryPrice; 31 } 32 }
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml" lang="ko" xml:lang="ko"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <title>이벤트</title> 6 <link rel="stylesheet" href="../commCSS.css" type="text/css" /> 7 <script language="javascript" type="text/javascript" src="../prototype_160.js"></script> 8 <script language="javascript" type="text/javascript" src="event.js"></script> 9 </head> 10 <body> 11 <h1>이벤트 발생</h1> 12 <div id="groupOne"> 13 수량: <input type="text" id="qty" /> 14 단가: <input type="text" id="price" /> 15 16 <br /><br /> 17 <div id="showArea"> 18 <div id="show1"></div><br /> 19 <div id="show2"></div><br /> 20 <div id="show3"></div> 21 </div> 22 </div> 23 </body> 24 </html>
| ADODB와 쿼리 캐시를 사용 하는 방법? (0) | 2011.12.17 |
|---|---|
| Web Standard Class (0) | 2011.12.15 |
| DOM 기초 (0) | 2011.12.12 |
| 웹 폰트 web font (0) | 2011.11.21 |
| 이벤트 리스너같이 사용하는 PHP클래스 (0) | 2011.11.13 |
1 //----------------------------------------------------- 2 // 엘리먼트 오브젝트 3 //----------------------------------------------------- 4 window.onload = function () { 5 var okClick = document.getElementById('okClick'); 6 if (okClick.attachEvent) { 7 okClick.attachEvent('onclick', Show.okClick); // IE 8 } else { 9 okClick.addEventListener('click', Show.okClick, false); // IE 이외 10 } 11 } 12 var Show = { 13 okClick: function(event) { 14 var sportObject = document.getElementById('likeSport'); 15 var showOne = document.getElementById('show1'); 16 showOne.innerHTML = '1. ' + sportObject; 17 18 var addSportObject = document.getElementById('addSport'); 19 var showThree = document.getElementById('show2'); 20 showThree.innerHTML = '2. ' + addSportObject; 21 } 22 }자자 그렇지?
| Web Standard Class (0) | 2011.12.15 |
|---|---|
| DOM Event (0) | 2011.12.13 |
| 웹 폰트 web font (0) | 2011.11.21 |
| 이벤트 리스너같이 사용하는 PHP클래스 (0) | 2011.11.13 |
| PHP 객체 생성자와 객체 파괴자 (0) | 2011.11.13 |
| DOM Event (0) | 2011.12.13 |
|---|---|
| DOM 기초 (0) | 2011.12.12 |
| 이벤트 리스너같이 사용하는 PHP클래스 (0) | 2011.11.13 |
| PHP 객체 생성자와 객체 파괴자 (0) | 2011.11.13 |
| 로그인 Text area에 내용입력등의 기본 글자 넣기 (0) | 2011.11.10 |
| 1 <?php 2 class MyObject{ 3 4 private $starr = array(); 5 6 public function __construct(){} 7 8 //메쏘드 또는 함수 등록 9 public function addStateListener($state, $method, $object=null){ 10 $idx = count($this->starr); 11 $this->starr['state'][$idx] = $state; 12 $this->starr['object'][$idx] = $object; 13 $this->starr['method'][$idx] = $method; 14 } 15 16 //콜백 실행 17 protected function executeState($state/*,...*/){ 18 19 $args = func_get_args(); 20 array_shift($args); //첫번째 인자인 state는 args에서 제외시킨다 21 22 if(($idx = array_search($state, $this->starr['state'])) < 0) return; 23 24 if(is_object($this->starr['object'][$idx])){ //콜백이 오브젝트이면 (오브젝트 우선) 25 call_user_method_array($this->starr['method'][$idx], $this->starr['object'][$idx], $args); 26 }else{ //콜백이 함수이면 27 call_user_func_array($this->starr['method'][$idx], $args); 28 } 29 } 30 31 public function __destruct(){} 32 } 33 34 35 //==================================================== 36 // 예제 1 함수를 호출 37 //==================================================== 38 class Board extends MyObject{ 39 40 private $is_login = false; //예를 위해서 강제로 로그아웃 상태로 만듬 41 42 function write(){ 43 if(!$this->is_login){ 44 $this->executeState('needlogin', '게시판에 쓸려면 가입해라!'); 45 }else{ 46 echo "글을 씁시다"; 47 } 48 } 49 } 50 51 function showMessage($str){ 52 echo "<script>alert('".$str."');</script>"; 53 exit; 54 } 55 56 $b = new Board(); 57 $b->addStateListener('needlogin', 'showMessage'); //콜백 함수를 등록한다 58 59 //자 글을 등록해보자 60 $b->write(); 61 62 63 64 //==================================================== 65 // 예제 2 클래스의 메쏘드를 호출 66 //==================================================== 67 class Board extends MyObject{ 68 69 private $is_login = false; //예를 위해서 강제로 로그아웃 상태로 만듬 70 71 function write(){ 72 if(!$this->is_login){ 73 $this->executeState('needlogin'); 74 }else{ 75 echo "글을 씁시다"; 76 } 77 } 78 } 79 80 //로그인 폼 처리 클래스 81 class LoginProcess{ 82 83 //귀찮아서 html 그냥 씁니다. 84 public function showbox(){ 85 echo <<< HEREDOC 86 <table border=1> 87 <tr> 88 <td>아 이 디 : <input type="text" name="mb_id"></td> 89 </tr> 90 <tr> 91 <td>비밀번호 : <input type="password" name="mb_pw"></td> 92 </tr> 93 <tr> 94 <td><input type="submit" value="로그인"></td> 95 </tr> 96 </table> 97 HEREDOC; 98 } 99 } 100 101 $b = new Board(); 102 $l = new LoginProcess(); 103 $b->addStateListener('needlogin', 'showbox', $l); 104 105 //자 글을 등록해보자 106 $b->write(); 107 ?> |
| DOM 기초 (0) | 2011.12.12 |
|---|---|
| 웹 폰트 web font (0) | 2011.11.21 |
| PHP 객체 생성자와 객체 파괴자 (0) | 2011.11.13 |
| 로그인 Text area에 내용입력등의 기본 글자 넣기 (0) | 2011.11.10 |
| HTML 풍선 도움말, 줄바꿈 효과 (0) | 2011.11.10 |
PHP 5 는 개발자로 하여름 클래스를 위해 생성자 메소드를 선언할 수 있게 한다. 생성자 메소드를 가진 클래스들은 새롭게 생성된 객체에서 이 메소드를 초기화 하는데 적당하게 호출해서 객체가 사용되기 전에 필요로 하지 않게 할 것이다.
PHP 4 에서 생성자 메소드는 클래스 자신의 이름과 같은 이름을 가진 클래스 메소드였다. 파생된 클래스로부터 부모 생성자를 호출하는 것이 매우 일반적일 때, PHP 4는 거대한 클래스 계층 주변으로 클래스를 옮기는 성가신 부분을 만들어내는 방법을 택해 작업했다. 만약 클래스가 다른 부모클래스 아래로 귀속하기 위해 옮겨졌을 때, 부모클래스 생성자의 잘 바뀌는 이름과 부모클래스 생성자를 호출하는 파생된 클래스의 코드는 수정될 것이다.
PHP 5 는 __construct()라는 이름으로 불리우는 생성자 메소드를 선언하는 표준방법을 도입하였다.
|
Example B-12. using new unified constructors
|
이전 버전과의 호환성을 위해 만약 PHP 5 가 주어진 클래스를 위한 __construct() 함수를 찾지 못한다면 클래스의 이름으로 이루어진 이전 방식의 생성자 함수를 찾을 것이다.
효과적으로 이것은 클래스가 __construct() 라는 이름을 가진 메소드를 가진 경우 이것이 다른 의미론을 위해 쓰일것이라는 의미를 가지고 있는데 호환성 문제를 가진 경우에 한해서만 해당한다.
객체를 위해 파괴자를 정의하는 능력을 소유하는 것은 매우 유용할 수 있다. 파괴자는 디버깅을 위해, 데이터베이스의 연결을 끊을 때,기타 다른 여러가지 일을 마무리할 때 로그 메세지를 남길 수 있다. PHP 4에선느 객체 파괴자를 위한 기술이 존재하지 않았지만, PHP가 셧다운을 요청하는 도중에 실행될 등록함수를 위해 이미 지원했다.
PHP 5 는 자바와 같은 다른 객체지향언어에서와 유사한 개념을 가진 파괴자를 도입하였다. : 객체의 파괴자를 파괴한 객체가 최종적으로 참조되었을때, 어떤 파라미터 값도 받지 않는 __destruct() 라고 이름 붙여진 클래스 메소드는 메모리에서 객체가 해제되기 전에 호출된다.
|
Example B-13. Destructor
|
생성자와 같이 부모클래스의 파괴자는 엔진에 의해 명시적으로 호출되지는 않을 것이다. 부모클래스의 파괴자를 실행하기 위해 파생된 클래스에서는 명확하게 파괴자 본문에 parent::__destruct() 를 적어 호출하여야 한다.
|
//예제) 범위지정연산자를 이용한 부모(상위)클래스에서 정의한 생성자 함수 호출 2 <? 3 class Parents { 4 5 // 클래스의 생성자 함수 6 public function __construct(){ echo "부모(상위)클래스에서 정의한 생성자 함수 호출"; } 7 8 } 9 10 class Child extends Parents { 11 12 // 클래스의 생성자 함수 13 public function __construct(){ 14 15 // 부모(상위)클래스에서 정의한 생성자 함수 호출 16 parent::__construct(); 17 18 } 19 20 } 21 22 // 출력 : 부모(상위)클래스에서 정의한 생성자 함수 호출 23 $Obj_Child = new Child(); 24 25 //위 예제는 부모클래스에서 정의한 생성자 함수를 호출해야 하므로 parent:: 를 사용했다 26 27 ?> |
| 웹 폰트 web font (0) | 2011.11.21 |
|---|---|
| 이벤트 리스너같이 사용하는 PHP클래스 (0) | 2011.11.13 |
| 로그인 Text area에 내용입력등의 기본 글자 넣기 (0) | 2011.11.10 |
| HTML 풍선 도움말, 줄바꿈 효과 (0) | 2011.11.10 |
| 성공적인 웹프로그래밍 PHP와 MySQL (4판) (0) | 2011.10.20 |
1. 클릭하면 지우기
<textarea cols=40 rows=5 onclick="this.value=''">내용을 입력하세요</textarea>
2. 클릭했을때 사용자가 입력한 문장이면 지우지 않기
<textarea cols=40 rows=5 onclick="if(this.value=='내용을 입력하세요'){this.value=''}">내용을 입력하세요</textarea>
| 이벤트 리스너같이 사용하는 PHP클래스 (0) | 2011.11.13 |
|---|---|
| PHP 객체 생성자와 객체 파괴자 (0) | 2011.11.13 |
| HTML 풍선 도움말, 줄바꿈 효과 (0) | 2011.11.10 |
| 성공적인 웹프로그래밍 PHP와 MySQL (4판) (0) | 2011.10.20 |
| HTML디자인 테크닉 - HTML tag 이야기 - 이것저것 궁금했던 것들과 외울것들 (0) | 2011.10.20 |
http://www.itdi.co.kr/onuri/bbs/board.php?bo_table=03_1&wr_id=25
여러 TAG에 풍선도움말 효과 주기 소스
글쓴이 : 정민구 날짜 : 09-04-06 19:27 조회 : 2146
<font size=2 title="풍선 도움말">일반 글씨에도 풍선 도움말이 가능해요</font>
<b title="풍선 도움말">진하기 속성도 가능해요!</b>
<i title="풍선 도움말">이탤릭 속성도 가능해요!</i>
<u title="풍선 도움말">밑줄 속성도 가능해요!</u>
<input type="text" value="텍스트 박스도 가능해요" title="풍선도움말">
<input type="button" value="기타 다른 폼도 가능해요" title="풍선도움말">
<p title="풍선 도움말">패러그래프도 되나요?</p>
<ul><li title="풍선 도움말">리스트는요?</li></ul>
[출처] IT.DevInfo ∽ 힘든 IT개발자들의 즐거운 공유(ITDI.co.kr) - http://www.itdi.co.kr/onuri/bbs/board.php?bo_table=03_1&wr_id=25
풍선도움말에 줄바꿈 효과 주기
글쓴이 : 정민구 날짜 : 09-04-06 19:30 조회 : 1807
<img src="/images/test.gif" alt="설명1&anp;#13;설명2&anp;#13;설명3">
[이 게시물은 사랑니님에 의해 2009-08-02 15:52:26 기타에서 이동 됨]
[출처] IT.DevInfo ∽ 힘든 IT개발자들의 즐거운 공유(ITDI.co.kr) - http://www.itdi.co.kr/onuri/bbs/board.php?bo_table=03_1&wr_id=3
| PHP 객체 생성자와 객체 파괴자 (0) | 2011.11.13 |
|---|---|
| 로그인 Text area에 내용입력등의 기본 글자 넣기 (0) | 2011.11.10 |
| 성공적인 웹프로그래밍 PHP와 MySQL (4판) (0) | 2011.10.20 |
| HTML디자인 테크닉 - HTML tag 이야기 - 이것저것 궁금했던 것들과 외울것들 (0) | 2011.10.20 |
| HTTP ERROR: 404 Not Found 의 의미 (0) | 2011.09.14 |
DB에서 table디자인을 스키마라고 부른다.
| 로그인 Text area에 내용입력등의 기본 글자 넣기 (0) | 2011.11.10 |
|---|---|
| HTML 풍선 도움말, 줄바꿈 효과 (0) | 2011.11.10 |
| HTML디자인 테크닉 - HTML tag 이야기 - 이것저것 궁금했던 것들과 외울것들 (0) | 2011.10.20 |
| HTTP ERROR: 404 Not Found 의 의미 (0) | 2011.09.14 |
| HTML Table Tag, Frameset Tag (0) | 2011.07.21 |
Style sheet는 디자이너가 해야 좋다.
| HTML 풍선 도움말, 줄바꿈 효과 (0) | 2011.11.10 |
|---|---|
| 성공적인 웹프로그래밍 PHP와 MySQL (4판) (0) | 2011.10.20 |
| HTTP ERROR: 404 Not Found 의 의미 (0) | 2011.09.14 |
| HTML Table Tag, Frameset Tag (0) | 2011.07.21 |
| FORM tag와 PHP 연동 (0) | 2011.07.21 |
"HTTP ERROR: 404 Not Found" 라는 메세지를 요즘은 정말 자주본다. 아무래도 블로그를 하면서부터 인터넷 서핑이 더 잦아진거 같은데 링크를 클릭하면 한번씩 "HTTP ERROR: 404 Not Found"라는 에러를 본다.
네이버 지식검색 에서 찾아보니 내용은 아래와 같았다.
404 에러는 요구한페이지의 url을 가져올 수 없을때 생기는 에러 입니다. url의 철자가 틀렸거나 경로가 틀렸을것 같네요참조하세요!!
참고로 발생하기 쉬운 HTTP상태코드들을 올려 드릴께요..
200 : request가 성공적으로 완료되었음.
204 : request가 실행되었으나 클라이언트에게 보낼 데이터가 없음.
300 : 요구된 request가 여러 위치에 존재하는
자원을 필요로 하므로
request는 위에대한 정보를 보낸다. 클라이언트는 가장 적당한
위치를 선택하여야 함.
302 :
request가 요구한 데이터를 발견하였으나 실제 다른 url에 존재함.
400 : request의 문법이 잘못되었음.
403 :
request는 금지된 자원을 요구하였음.
404 : 서버는 요구된 url을 찾을 수 없음.
500 : 서버에 내부적으로 오류가
발생하여 더 이상을 진행할 수 없음.
501 : 요청된 request는 합법적이나 서버는 요구된 method를 지원하지 않음.
503 : 서버가 바쁘기 때문에 서비스를 할 수 없음.
| 성공적인 웹프로그래밍 PHP와 MySQL (4판) (0) | 2011.10.20 |
|---|---|
| HTML디자인 테크닉 - HTML tag 이야기 - 이것저것 궁금했던 것들과 외울것들 (0) | 2011.10.20 |
| HTML Table Tag, Frameset Tag (0) | 2011.07.21 |
| FORM tag와 PHP 연동 (0) | 2011.07.21 |
| font 글씨 모양새를 원하는대로 바꾸려면 (0) | 2011.07.19 |
| HTML디자인 테크닉 - HTML tag 이야기 - 이것저것 궁금했던 것들과 외울것들 (0) | 2011.10.20 |
|---|---|
| HTTP ERROR: 404 Not Found 의 의미 (0) | 2011.09.14 |
| FORM tag와 PHP 연동 (0) | 2011.07.21 |
| font 글씨 모양새를 원하는대로 바꾸려면 (0) | 2011.07.19 |
| PHP 디버깅 (0) | 2011.07.18 |
아래에서 확인할 수 있듯이,
form의 action에 php (call back)를 넣고서
막상 php에서는 $userid 등으로 처리한다.
| HTTP ERROR: 404 Not Found 의 의미 (0) | 2011.09.14 |
|---|---|
| HTML Table Tag, Frameset Tag (0) | 2011.07.21 |
| font 글씨 모양새를 원하는대로 바꾸려면 (0) | 2011.07.19 |
| PHP 디버깅 (0) | 2011.07.18 |
| 아이디 희미하게 Onfocus Onclick (0) | 2011.07.12 |
| HTML Table Tag, Frameset Tag (0) | 2011.07.21 |
|---|---|
| FORM tag와 PHP 연동 (0) | 2011.07.21 |
| PHP 디버깅 (0) | 2011.07.18 |
| 아이디 희미하게 Onfocus Onclick (0) | 2011.07.12 |
| Input Box에 미리 글 써넣기 (0) | 2011.07.12 |
| FORM tag와 PHP 연동 (0) | 2011.07.21 |
|---|---|
| font 글씨 모양새를 원하는대로 바꾸려면 (0) | 2011.07.19 |
| 아이디 희미하게 Onfocus Onclick (0) | 2011.07.12 |
| Input Box에 미리 글 써넣기 (0) | 2011.07.12 |
| Edit Plus 태그 (0) | 2011.07.11 |
| font 글씨 모양새를 원하는대로 바꾸려면 (0) | 2011.07.19 |
|---|---|
| PHP 디버깅 (0) | 2011.07.18 |
| Input Box에 미리 글 써넣기 (0) | 2011.07.12 |
| Edit Plus 태그 (0) | 2011.07.11 |
| PHP 그림 사이즈 바꾸는 코드 (0) | 2011.07.01 |
| PHP 디버깅 (0) | 2011.07.18 |
|---|---|
| 아이디 희미하게 Onfocus Onclick (0) | 2011.07.12 |
| Edit Plus 태그 (0) | 2011.07.11 |
| PHP 그림 사이즈 바꾸는 코드 (0) | 2011.07.01 |
| HTML form tag (0) | 2011.06.27 |
| 아이디 희미하게 Onfocus Onclick (0) | 2011.07.12 |
|---|---|
| Input Box에 미리 글 써넣기 (0) | 2011.07.12 |
| PHP 그림 사이즈 바꾸는 코드 (0) | 2011.07.01 |
| HTML form tag (0) | 2011.06.27 |
| Tag & Java Script (0) | 2011.06.06 |
| Input Box에 미리 글 써넣기 (0) | 2011.07.12 |
|---|---|
| Edit Plus 태그 (0) | 2011.07.11 |
| HTML form tag (0) | 2011.06.27 |
| Tag & Java Script (0) | 2011.06.06 |
| Span & Div 차이 (0) | 2011.06.04 |
| Edit Plus 태그 (0) | 2011.07.11 |
|---|---|
| PHP 그림 사이즈 바꾸는 코드 (0) | 2011.07.01 |
| Tag & Java Script (0) | 2011.06.06 |
| Span & Div 차이 (0) | 2011.06.04 |
| Java Script + HTML (0) | 2011.06.03 |
| PHP 그림 사이즈 바꾸는 코드 (0) | 2011.07.01 |
|---|---|
| HTML form tag (0) | 2011.06.27 |
| Span & Div 차이 (0) | 2011.06.04 |
| Java Script + HTML (0) | 2011.06.03 |
| HTML css (0) | 2011.06.01 |
| HTML form tag (0) | 2011.06.27 |
|---|---|
| Tag & Java Script (0) | 2011.06.06 |
| Java Script + HTML (0) | 2011.06.03 |
| HTML css (0) | 2011.06.01 |
| HTML Frame Table anchoring (0) | 2011.06.01 |
| Tag & Java Script (0) | 2011.06.06 |
|---|---|
| Span & Div 차이 (0) | 2011.06.04 |
| HTML css (0) | 2011.06.01 |
| HTML Frame Table anchoring (0) | 2011.06.01 |
| HTML Summary (0) | 2011.06.01 |
중요한 것은 css style은 꼭 head tag안에 들어있어야 한다.
| Span & Div 차이 (0) | 2011.06.04 |
|---|---|
| Java Script + HTML (0) | 2011.06.03 |
| HTML Frame Table anchoring (0) | 2011.06.01 |
| HTML Summary (0) | 2011.06.01 |
| 웹 프로그래밍 구조 (0) | 2011.05.30 |
cf) iframe은 프레임을 나눠서 파일을 부르는게 아니고, 그 안에서 프레임을 직접 나누는 명령어
<iframe src="^^.html" frameborder="1" </iframe>
i-> inline frame
| Java Script + HTML (0) | 2011.06.03 |
|---|---|
| HTML css (0) | 2011.06.01 |
| HTML Summary (0) | 2011.06.01 |
| 웹 프로그래밍 구조 (0) | 2011.05.30 |
| Mysql 문법 (0) | 2011.05.19 |
| Java Script + HTML (0) | 2011.06.03 |
|---|---|
| HTML css (0) | 2011.06.01 |
| HTML Frame Table anchoring (0) | 2011.06.01 |
| 웹 프로그래밍 구조 (0) | 2011.05.30 |
| Mysql 문법 (0) | 2011.05.19 |
css-2.html
