Voyager : Walking This Planet

function adjustStyle(width) {
  width = parseInt(width);
  if (width < 1000) {
    $("#ttt").hide();
  } else {
    $("#ttt").show();
  }
}

$(function() {
  adjustStyle($(this).width());
  $(window).resize(function() {
    adjustStyle($(this).width());
  });
});

줄바꿈안함

white-space:nowrap;

줄바꿈

word-break:break-all;

word-break:nowrap은 적용이 잘 안되서

white-space로...

http://www.htmldrive.net/items/demo/872/Nice-Multiple-jQuery-Mega-Drop-Down-Menu

- 상단 네비게이션 일반 풀다운 메뉴 (멀티 서브메뉴 지원 )

http://www.htmldrive.net/items/demo/756/Scalable-Menu-with-jQuery-CSS3

- 상단 네비게이션 일반 풀다운 메뉴 (멀티 서브메뉴 지원 )

http://www.htmldrive.net/items/demo/201/jQuery-big-Drop-Down-Menu

- 상단 네비게이션 일반 풀다운 메뉴 (멀티 서브메뉴 지원 , 애니메이션 )

http://www.htmldrive.net/items/demo/1182/Rich-Media-Dropdown-Menu-with-jQuery

- 멀티 서브메뉴 ( 이미지 사용가능 )

http://www.htmldrive.net/items/demo/1179/Pure-CSS3-slide-dropdown-Menu

- 상단 네비게이션 일반 풀다운 메뉴

http://www.htmldrive.net/items/demo/1070/CSS3-multiple-color-Top-Fixed-Menu

- 상단 네비게이션 일반 풀다운 메뉴 (롤오버 색깔 변경 )

http://www.htmldrive.net/items/demo/1012/Stylish-CSS-Jquery-auto-induction-boundary-of-menu

- 상단 네비게이션 일반 풀다운 메뉴 (flat version)

http://www.htmldrive.net/items/demo/1046/Useful-Magazine-Style-Dropdown-Menu-with-jQuery

- 상단 네비게이션 일반 풀다운 메뉴 (서브메뉴 1개 )

http://www.htmldrive.net/items/demo/979/simple-google-style-Dropdown-menu-with-jQuery

- 상단 네비게이션 일반 풀다운 메뉴  (클릭 이벤트 )

http://www.htmldrive.net/items/demo/1463/Amazon-Side-Bar-Menu-with-jquery

-left 풀다운 ( 우측으로 펼쳐짐 )

http://www.htmldrive.net/items/demo/251/Simple-JQuery-Accordion-Collapsing-menu

- left 풀다운 메뉴 ( 아래로 펼쳐짐 )

http://www.htmldrive.net/items/demo/1448/cross-browser-Multi-level-push-menu-with-jQuery

- left 모바일 메뉴

http://jqueryui.com/menu/

- 심플 스탠다드형 jquery left 메뉴

http://slicknav.com/

- 접기가능(상하)한 3depth 형 left 메뉴

http://adnantopal.github.io/slimmenu/#

- IE8이상

http://www.dynamicdrive.com/dynamicindex1/compactmenu.htm

- DEMO3 접기가능

http://www.webdesigncrowd.com/demo/play-google-10.7.13/

- IE8이상

http://designmodo.com/demo/jqueryaccordionmenu/

- left 메뉴 펼침(상하)

http://tympanus.net/Tutorials/GoogleNexusWebsiteMenu/

- google nexus website menu 강력 추천하나.. IE8 미지원

http://mmenu.frebsite.nl/

- 메뉴 항목에대한 설명 표시가능 (접기 불가)

- IE 8 표시 안됨 (표준)

http://www.designchemical.com/lab/jquery-vertical-mega-menu-plugin/examples/

http://www.designchemical.com/lab/demo-wordpress-jquery-vertical-mega-menu-plugin.html

- left menu 네비게이션 (멀티 서브메뉴 지원 ) ★강추

http://www.designchemical.com/lab/demo-wordpress-vertical-accordion-menu-plugin/

- left 드랍 메뉴

http://nowtheme.com/2013/05/jquery-accordion-menu-and-slider-plugins/

각 가지 메뉴 모음

http://codecanyon.net/item/jquery-plugin-drop-list/full_screen_preview/396988?ref=themespotters

- left menu (2depth, 드랍)  IE9 이상

http://thecodeplayer.com/walkthrough/vertical-accordion-menu-using-jquery-css3

- Vertical accordion menu (jQuery & CSS3) IE8 지원

[출처] jQuery & CSS3 를 활용한 메뉴 네비게이션 소스 모음 | 작성자 Yohan
http://blog.naver.com/jyh0528/220295629856

추가

http://blog.templatemonster.com/demos/color-coded-dropdown-navigation-with-submenus/demo/index.html

http://tympanus.net/Tutorials/GoogleNexusWebsiteMenu/ (굿)

display 속성

inline : 다른요소와 행을 공유하며 높이값 등 속성이 적용되지 않는다.

block : 다른요소와 행을 공유하지 않으며, 높이값 등 속성을 가질 수 있다.

inline-block : 다른요소와 행을 공유하며, 고유 속성도 가질 수 있다.

주요 html 태그별 속성

<a> inline

<div> block

<img> inline

<h1> block

<p> block

<li><ol><ul> block

<span> inline

<table> block

<input> inline

<form> block

<blockquote> block

1. 구굴 Chart

https://developers.google.com/chart/?hl=ko&csw=1

2. Chart.js

http://www.chartjs.org/

3. xCharts

http://tenxer.github.io/xcharts/

4. FusionCharts

http://www.fusioncharts.com/jquery/

5. morris.js

https://github.com/morrisjs/morris.js/

http://www.jqueryscript.net/chart-graph/Morris-Good-looking-Charts-Plugin.html

6. jqPlot

http://www.jqplot.com/

7. Axiis

http://www.axiis.org/

8. gRaphaeljs

http://g.raphaeljs.com/

9. Elycharts

http://elycharts.com/

10. Flotr2

http://humblesoftware.com/flotr2/index

리얼타임그래프.

1.리얼타임을 위한 그래프..

http://www.flotcharts.org/   https://code.google.com/p/flot/

2. 스파클라인

http://omnipotent.net/jquery.sparkline/#s-about

조직도 챠트

http://dl.dropboxusercontent.com/u/4151695/html/jOrgChart/example/example.html#

유료 (비상업으론 무료도 있음)

http://www.jscharts.com/

http://www.amcharts.com/

http://www.highcharts.com/

알아두면 좋을....

http://raphaeljs.com/

http://dygraphs.com/

여러개 사용해봤지만...

개인적으로 ..http://www.flotcharts.org/ 를 추천한다.

http://www.jqueryflottutorial.com/how-to-make-jquery-flot-pie-chart.html

[출처] 쓸만한 jQuery 챠트 | 작성자 사랑굳

http://blog.naver.com/forioso/10174679854

추가

http://www.highcharts.com/demo/line-labels

substr ($String, $start_Pos, $length);

$String에 담고 있는 문자열의 $start_Pos부터 길이$length만큼을 잘라내어 반환한다

$str = "PHP test";

$str = substr($str, 4, 4);

echo "$str";

결과 : test

strlen('test');

결과 : 4

글자수 구하는 함수

floor - 버림

floor(3.7) // 4

floor(9.9999) // 9

ceil - 무조건 올림

ceil(4.1) // 5

ceil(9.999) // 10

round - 반올림

round(3.4); // 3

round(3.5);  // 4

round(3.5, 0);  // 4

round(1.955123, 2); // 1.96

round(5.041, 2); // 5.04

round(5.055, 2); // 5.06

TEXTAREA 제거

$content = preg_replace("!<TEXTAREA(.*?)>!is","[TEXTAREA]",$content);
$content = preg_replace("!</TEXTAREA(.*?)>!is","[/TEXTAREA]",$content);

script 제거
$str=preg_replace("!<script(.*?)<\/script>!is","",$str);

iframe 제거
$str=preg_replace("!<iframe(.*?)<\/iframe>!is","",$str);

meta 제거
$str=preg_replace("!<meta(.*?)>!is","",$str);

style 태그 제거
$str=preg_replace("!<style(.*?)<\/style>!is","",$str);

&nbsp;를 공백으로 변환
$str=str_replace("&nbsp;"," ",$str);

연속된 공백 1개로
$str=preg_replace("/\s{2,}/"," ",$str);

태그안에 style= 속성 제거
$str=preg_replace("/ zzstyle=([^\"\']+) /"," ",$str); // style=border:0... 따옴표가 없을때
$str=preg_replace("/ style=(\"|\')?([^\"\']+)(\"|\')?/","",$str); // style="border:0..." 따옴표 있을때

태그안의 width=, height= 속성 제거
$str=preg_replace("/ width=(\"|\')?\d+(\"|\')?/","",$str);
$str=preg_replace("/ height=(\"|\')?\d+(\"|\')?/","",$str);

img 태그 추출 src 추출
preg_match("/<img[^>]*src=[\"']?([^>\"']+)[\"']?[^>]*>/i",$str,$RESULT);
preg_match_all("/<img[^>]*src=[\"']?([^>\"']+)[\"']?[^>]*>/i",$str,$RESULT);

호스트 추출
<?
preg_match("/^(http:\/\/)?([^\/]+)/i","http://www.naver.com/index.php",$matches);
$host = $matches[2];
echo$matches[0]."<br>";
echo$matches[1]."<br>";
echo$matches[2]."<br>";
?>

출처 : http://blog.naver.com/honglaeggo/90194126848