2015. 7. 3. 12:53

CSS로 만든 깔끔하고 다양한 색상의 상단 메뉴바가 있어 소개합니다.


CSS가 적용되지 않으면 이렇게 보입니다.

깔끔하면서도 방탄웹으로 잘 만들었네요~

http://naradesign.net/wp/2010/02/11/1185/

 

http://zzznara2.tistory.com/290

'WebPrograming > HTML|CSS' 카테고리의 다른 글

CSS 메뉴 만들기 CSS MENU MAKER  (0) 2015.07.03
Posted by 물색없는세상
2015. 7. 3. 12:53

CSS 메뉴 만들기를 해보도록 하겠습니다. 방법은 어렵지는 않습니다. CSS MENU MAKER 사이트에 접속해서 원하는 형태를 선택하고 만들기를 하면 만들어집니다. 사용방법도 간단한게 장점이구요. CSS 메뉴 만들기 내부 메뉴에는 템플릿으로 미리 만들어진것도 존재하고 또는 직접 만들 수 도 있습니다. 물론 잘만들어진 템플릿 선택 후 원하는 내용만 수정할 수 도 있습니다. 생각보다는 꽤 여러가지 템플릿이 있으며 쉽고 빠르게 메뉴를 꾸밀 수 있다는 점이 장점입니다. 그런데 애드센스 정책상 위에 뭔가 떠 있으면 안된다는것 때문에 약간 사용상 제한은 있을 듯 합니다. 블로그 상단에 쓰일 때 말이죠. 사이드바에 메뉴를 넣으면 상관없겠지만요. 이부분은 잘 확인해보시고 적용해 보시기 바랍니다.

CSS 메뉴 만들기, CSS 메뉴, CSS메뉴, CSS MENU MAKER, IT,CSS 메뉴 만들기를 해보도록 하겠습니다. 방법은 어렵지는 않습니다. CSS MENU MAKER 사이트에 접속해서 원하는 형태를 선택하고 만들기를 하면 만들어집니다. 사용방법도 간단한게 장점이구요. CSS 메뉴 만들기 내부 메뉴에는 템플릿으로 미리 만들어진것도 존재하고 또는 직접 만들 수 도 있습니다. 물론 잘만들어진 템플릿 선택 후 원하는 내용만 수정할 수 도 있습니다. 생각보다는 꽤 여러가지 템플릿이 있으며 쉽고 빠르게 메뉴를 꾸밀 수 있다는 점이 장점입니다. 그런데 애드센스 정책상 위에 뭔가 떠 있으면 안된다는것 때문에 약간 사용상 제한은 있을 듯 합니다. 블로그 상단에 쓰일 때 말이죠. 사이드바에 메뉴를 넣으면 상관없겠지만요. 이부분은 잘 확인해보시고 적용해 보시기 바랍니다.



http://cssmenumaker.com/

위 사이트에 먼저 접속 합니다.


CSS 메뉴 만들기, CSS 메뉴, CSS메뉴, CSS MENU MAKER, IT,CSS 메뉴 만들기를 해보도록 하겠습니다. 방법은 어렵지는 않습니다. CSS MENU MAKER 사이트에 접속해서 원하는 형태를 선택하고 만들기를 하면 만들어집니다. 사용방법도 간단한게 장점이구요. CSS 메뉴 만들기 내부 메뉴에는 템플릿으로 미리 만들어진것도 존재하고 또는 직접 만들 수 도 있습니다. 물론 잘만들어진 템플릿 선택 후 원하는 내용만 수정할 수 도 있습니다. 생각보다는 꽤 여러가지 템플릿이 있으며 쉽고 빠르게 메뉴를 꾸밀 수 있다는 점이 장점입니다. 그런데 애드센스 정책상 위에 뭔가 떠 있으면 안된다는것 때문에 약간 사용상 제한은 있을 듯 합니다. 블로그 상단에 쓰일 때 말이죠. 사이드바에 메뉴를 넣으면 상관없겠지만요. 이부분은 잘 확인해보시고 적용해 보시기 바랍니다.



아래로 내려보면 여러가지 메뉴가 나타납니다. 마음에 드는 메뉴를 먼저 선택 합니다.



CSS 메뉴 만들기, CSS 메뉴, CSS메뉴, CSS MENU MAKER, IT,CSS 메뉴 만들기를 해보도록 하겠습니다. 방법은 어렵지는 않습니다. CSS MENU MAKER 사이트에 접속해서 원하는 형태를 선택하고 만들기를 하면 만들어집니다. 사용방법도 간단한게 장점이구요. CSS 메뉴 만들기 내부 메뉴에는 템플릿으로 미리 만들어진것도 존재하고 또는 직접 만들 수 도 있습니다. 물론 잘만들어진 템플릿 선택 후 원하는 내용만 수정할 수 도 있습니다. 생각보다는 꽤 여러가지 템플릿이 있으며 쉽고 빠르게 메뉴를 꾸밀 수 있다는 점이 장점입니다. 그런데 애드센스 정책상 위에 뭔가 떠 있으면 안된다는것 때문에 약간 사용상 제한은 있을 듯 합니다. 블로그 상단에 쓰일 때 말이죠. 사이드바에 메뉴를 넣으면 상관없겠지만요. 이부분은 잘 확인해보시고 적용해 보시기 바랍니다.



메뉴를 확인 합니다. 왼쪽 아래에 customize / download 를 선택 합니다.


CSS 메뉴 만들기, CSS 메뉴, CSS메뉴, CSS MENU MAKER, IT,CSS 메뉴 만들기를 해보도록 하겠습니다. 방법은 어렵지는 않습니다. CSS MENU MAKER 사이트에 접속해서 원하는 형태를 선택하고 만들기를 하면 만들어집니다. 사용방법도 간단한게 장점이구요. CSS 메뉴 만들기 내부 메뉴에는 템플릿으로 미리 만들어진것도 존재하고 또는 직접 만들 수 도 있습니다. 물론 잘만들어진 템플릿 선택 후 원하는 내용만 수정할 수 도 있습니다. 생각보다는 꽤 여러가지 템플릿이 있으며 쉽고 빠르게 메뉴를 꾸밀 수 있다는 점이 장점입니다. 그런데 애드센스 정책상 위에 뭔가 떠 있으면 안된다는것 때문에 약간 사용상 제한은 있을 듯 합니다. 블로그 상단에 쓰일 때 말이죠. 사이드바에 메뉴를 넣으면 상관없겠지만요. 이부분은 잘 확인해보시고 적용해 보시기 바랍니다.



메뉴를 수정할 수 있습니다. 왼쪽 메뉴에서는 메뉴의 단계를 수정할 수 있고 선택 후 오른쪽 타이틀과 링크를 수정해서 메뉴를 변경할 수 있습니다.

모두 수정 후 download 를 합니다.


CSS 메뉴 만들기, CSS 메뉴, CSS메뉴, CSS MENU MAKER, IT,CSS 메뉴 만들기를 해보도록 하겠습니다. 방법은 어렵지는 않습니다. CSS MENU MAKER 사이트에 접속해서 원하는 형태를 선택하고 만들기를 하면 만들어집니다. 사용방법도 간단한게 장점이구요. CSS 메뉴 만들기 내부 메뉴에는 템플릿으로 미리 만들어진것도 존재하고 또는 직접 만들 수 도 있습니다. 물론 잘만들어진 템플릿 선택 후 원하는 내용만 수정할 수 도 있습니다. 생각보다는 꽤 여러가지 템플릿이 있으며 쉽고 빠르게 메뉴를 꾸밀 수 있다는 점이 장점입니다. 그런데 애드센스 정책상 위에 뭔가 떠 있으면 안된다는것 때문에 약간 사용상 제한은 있을 듯 합니다. 블로그 상단에 쓰일 때 말이죠. 사이드바에 메뉴를 넣으면 상관없겠지만요. 이부분은 잘 확인해보시고 적용해 보시기 바랍니다.



다운로드된 파일을 압축을 해제 후 실행해보면 메뉴가 나타나는것을 볼 수 있습니다. 이제 HTML 과 CSS 그리고 이미지 등을 적용하고자 하는 웹페이지에 업로드 후 적용을 합니다.

http://cdmanii.com/3875

Posted by 물색없는세상
2015. 6. 23. 10:11

http://silentvoyage.tistory.com/125

http://blog.naver.com/devstory/130095325607

http://blog.naver.com/cubot/140112250672

http://neosm.tistory.com/8

http://blog.naver.com/qola/110187703555

http://blog.acronym.co.kr/235

 

 

zxing

Homepage : https://code.google.com/p/zxing/
source : https://github.com/zxing/zxing


maven (pom.xml)

<dependency>
<groupId>com.google.zxing</groupId>
<artifactId>core</artifactId>
<version>2.1</version>
</dependency>
<dependency>
<groupId>com.google.zxing</groupId>
<artifactId>javase</artifactId>
<version>2.1</version>
</dependency>

 


QR 코드 생성 소스

import java.io.File;
import org.junit.Test;
import com.google.zxing.BarcodeFormat;
import com.google.zxing.client.j2se.MatrixToImageWriter;
import com.google.zxing.common.BitMatrix;
import com.google.zxing.qrcode.QRCodeWriter;

public class TestQRCode {

@Test
public void test() throws Exception {
QRCodeWriter qrCodeWriter = new QRCodeWriter();
String text = "http://iwastore.obigo.com/mobile";
//text = new String(text.getBytes("UTF-8"), "ISO-8859-1");
BitMatrix bitMatrix = qrCodeWriter.encode(text, BarcodeFormat.QR_CODE, 300, 300);
MatrixToImageWriter.writeToFile(bitMatrix, "png", new File("qrcode.png"));
}

}

 



웹 상에서 QR코드 바로 만들 수 있는 URL

Homepage : http://mqr.kr/generate/url/




jQuery QR 코드 만들기

Homepage : http://jeromeetienne.github.io/jquery-qrcode/
소스 : https://github.com/jeromeetienne/jquery-qrcode
blog : http://notes.jetienne.com/2011/04/07/jquery-qrcode.html

jquery-qrcode-master.zip





iText

컬러풀한 QR 코드 만들기

소스 :
http://sourceforge.net/projects/itext/files/iText/

참고 : http://blog.nooree.com/post.cfm/itext-colorful-qrcode


http://tyboss.tistory.com/59

Posted by 물색없는세상
2015. 5. 18. 17:37

<%@page import="org.json.JSONObject"%>

<%@page import="service.DBService"%>

<%@page import="vo.MemberVO"%>

<%@ page language="java" contentType="text/html; charset=UTF-8"

pageEncoding="UTF-8"%>

 

<%

 

// json으로 응답시 아래의 두 줄이 필요하다.

response.setHeader("Access-Control-Allow-Origin", "*");

response.setHeader("Access-Control-Allow-Headers", "X-Requested-With");

request.setCharacterEncoding("utf-8");

 

MemberVO[] ar = DBService.getAll();

 

// 라이브러리를 활용하여 배열 또는 ArrayList와 같은 객체를

// JSON표기로 전환하자! 우선

// http:// json.org로 접속하여 화면 하단에서 [Java]라는 분류의 첫번째

// [org.json]항목을 선택한다.

// 화면에서 [Free source code is ....]선택하여 [zip]버튼으로 다운받는다.

 

// 압축을 푼 후 그 안에 있는 ~.java파일들을 복사하여

// 현재 프로젝트의 [org.json]이라느 이름의 package를 생성하여 붙여넣기를 해둔다.

 



 

// 루트를 지정하면서 JSON으로 표현한다.

// JSONObject jo = new JSONObject();

// jo.put("TEST", ar);

// out.println(jo.toString());

%>


// 라이브러리를 이용하여 배열을 json으로 전환이 가능하다.

// 단 한줄로

<%=JSONObject.wrap(ar)%>

http://jdreams.tistory.com/44

Posted by 물색없는세상
2015. 5. 18. 17:37


=============================b.jsp===============================

<%@ page language="java" contentType="text/html; charset=EUC-KR"

pageEncoding="EUC-KR"%>

<html>

<head>

<style type="text/css">

table{

border-collapse: collapse;

}

td{

border: #ABF200 solid;

}

</style>

</head>

<script src="jquery-2.1.3.js"></script>

<script>

$(document).ready(function() {

$("#con").hide()

$("#b").click(function() {

$.ajax({

url : "a.jsp", // a.jsp 의 제이슨오브젝트값을 가져옴

dataType : "json", // 데이터 타입을 제이슨 꼭해야함, 다른방법도 2가지있음

cache : false, // 이걸 안쓰거나 true하면 수정해도 값반영이 잘안댐

success : function(data) {

$("#con").html(""); // div를 일단 공백으로 초기화해줌 , 왜냐면 버튼 여러번 눌리면 중첩되니깐

$("<table/>").css({

backgroundColor : "#E4F7BA",

border : "solid 3px #E4F7BA",

}).appendTo("#con"); // 테이블을 생성하고 그 테이블을 div에 추가함

var key = Object.keys(data["memberlist"][0]); // id , pw , addr , tel 의 키값을 가져옴

$("<tr>" , {

html : "<td>" + key[1] + "</td>"+ // 컬럼명들

"<td>" + key[2] + "</td>"+

"<td>" + key[0] + "</td>"+

"<td>" + key[3] + "</td>"

}).appendTo("table") // 이것을 테이블에붙임

$.each(data.memberlist, function(index, memberlist) { // 이치를 써서 모든 데이터들을 배열에 넣음

var items = [];

items.push("<td>" + memberlist.id + "</td>"); // 여기에 id pw addr tel의 값을 배열에 넣은뒤

items.push("<td>" + memberlist.pw + "</td>");

items.push("<td>" + memberlist.addr + "</td>");

items.push("<td>" + memberlist.tel + "</td>");

$("<tr/>", {

html : items // 티알에 붙임,

}).appendTo("table"); // 그리고 그 tr을 테이블에 붙임

});//each끝

}

});

$("#con").fadeToggle("slow")

});

});

</script>

<body>

<input type="button" id="b" value="회원정보보기">

<div id="con"></div>

</body>

</html>

===================================a.jsp====================================



<%@ page language="java" contentType="text/html; charset=EUC-KR"

pageEncoding="EUC-KR"%>

<%@ page import="java.util.*" %>

<%@ page import="kr.co.seoulit.member.dao.*" %>

<%@ page import="kr.co.seoulit.member.to.*" %>

<%@ page import="net.sf.json.*"%>

<%


MemberDAO dao=MemberDAOImpl.getInstance();

List<MemberBean> memberlist=dao.selectMemberList();

HashMap<String,Object> map=new HashMap<String,Object>();

map.put("memberlist",memberlist);

JSONObject jsonObject= new JSONObject();

jsonObject.putAll(map);

out.println(jsonObject);

%>

 

http://javakorea.tistory.com/253

Posted by 물색없는세상
2013. 5. 11. 06:57

<script type="text/javascript" src="/js/jQuery/jquery.xml2json.js"></script>

var xml = '<xml><message>Hello world</message></xml>';

var json = $.xml2json(xml);

alert(json.message);

자세한 내용은

http://www.fyneworks.com/jquery/xml-to-json/

 

http://blog.naver.com/dlckdrl/50086286841

Posted by 물색없는세상
2013. 3. 20. 17:59
var url = "http://stackoverflow.com";    
$
(location).attr('href',url);

 

http://blog.yes24.com/blog/blogMain.aspx?blogid=metalzang&artseqno=6289726

Posted by 물색없는세상
2013. 1. 18. 14:55

공통되는 부분을 <jsp:include>태그를 이용하여 간편하게 작성할 수 있지만 파일의 위치가 바뀌는 등의 수정을 할 경우가 생길 경우

이 태그를 사용한 모든 부분을 고쳐야한다.

이런 번거로움을 피할 수 있는 방법이 web.xml파일에서 <jsp:include>를 설정하는 방법이다.

다음과 같이 사용할 수 있다.

<jsp-config>
<jsp-property-group>
<url-pattern>/view/*</url-pattern>
<include-prelude>/menu/top.jsp</include-prelude>
<include-coda>/menu/bottom.jsp</include-coda>
</jsp-property-group>
</jsp-config>


<태그설명>

<url-pattern>/view/*</url-pattern> : 프로퍼티를 적용할 JSP파일에 해당되는 URL 패턴을 지정
<include-prelude /> : url-pattern에서 지정한 패턴에 해당되는 JSP파일의 앞에 자동으로 삽입될 페이지

<include-coda /> : url-pattern에서 지정한 패턴에 해당되는 JSP파일의 앞에 자동으로 삽입될 페이지

위와 같이 설정해두면 URL패턴이 view 의 경로에 있는 모든 페이지들은 로드될 때 <include-prelude />, <include-coda/>에 설정한 페이지들을 포함하여 보여진다.

 

http://raidparty.net/xe/2042

'WebPrograming > JSP' 카테고리의 다른 글

뒤로가기 방지  (0) 2012.06.11
JSP 달력(CSS적용)  (2) 2012.03.29
Posted by 물색없는세상
2012. 11. 22. 19:00

자바스크립트 프로그래밍을 하다보면 종종 그런 생각이 들 때가 있다.

마우스 우클릭 한번으로 내가 쌔빠지게 짜놓은 소스를 다른 사람들이 그대로 가져가서 쓴다면..

배가 아플텐데.. 나만그런가?-_ -; 여튼.. 나같은 엉덩이에 뿔난 사람들을 위한 암호화 툴을 소개

해보고자 한다.


우선 내가 알고 있는 툴은 현재 3가지가 있다.

1. Microsoft Script Encoder

2. Packer JavaScript

3. scriptasylum.com Javascript Encoder


각각 장단이 있지만(참고 : http://www.lovelgw.com/Blog/79) ms는 인코더와 함께 디코더도

뿌리는 바람에 의미가 없고 스크립트어사일럼은.. 덩치가 너무 커진다. 나모에서 사용하는 패커

도 어사일럼같은데 정확히는 모르겠다. 비슷한 방식이다.


그래서 추천하는게 Joliclic code에서 제공하는 스크립트 인코더이다.

http://joliclic.free.fr/php/javascript-packer/en/index.php

유니코드와 브라우저 호환성이 좋다.

라이브러리를 받아다가 서버에 올려놓고 사용해도 되고,

일회성 사용자들을 위하여 사이트에서 즉시 변환해서 사용할 수도 있다.




위와 같이 소스를 넣고 [Pack]를 누르면 바로 암호화된 코드가 튀어나온다.

이걸 그대로 갖다가 붙여넣으면 된다


단, 주의할점이 두 가지 있는데,

첫 번째는 자바스크립트의 고질적인 문제인 한글 문제이다. 에러라기 보다는 깨지는 문제가 발생한다.

미리 JavaScript escapes 등을 사용해서 변환해서 사용해야 한다.

두 번째는 디코딩이 생각보다 쉽다. 디코더가 따로 있는 것은 아니지만 alert문 같은 것은 눈으로도 가능

하고 코드를 유심히 들여다보면 그리 어렵지 않게 디코딩이 가능하다. 뭐.. 디코딩이 쉬우면 무슨 인코딩

의 의미가 있겠냐마는.. 누가 하릴없이 암호화소스를 보고앉아있을까..하는생각이든다-_-a..

 

http://lunaticlobelia.tistory.com/49

Posted by 물색없는세상
2012. 10. 26. 01:16

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="../jquery-1.7.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
 $('#btn').click(function() {
  //$.getJSON() 이용 - GetServlet : command - getJSON
  /*
  $.getJSON("../GetServlet","command=getJSON",function(data) {
   // 서블릿에서 넘겨줬을때 데이터가 JSON형태일때 사용하면 좋다.
   // data : JSON Object
   // alert(data.name);
   var str = data.id+"<br>"+data.name+"<br>"+data.age;
   $("div#first").html(str);
  });
  */
  $.getJSON("../GetServlet",{"command":"getJSON"},callback);//.getJSON은 함수 호출이 성공했을 경우만 호출이 되지만 onload는 성공하던 실패하던 실행이 된다.
 });
});

function callback(data, status, xhr) {
 //data : object
 if(xhr.status==200) {
  var str = data.id+"<br>"+data.name+"<br>"+data.age;
  $("#first").html(str);
  // alert(xhr.status);
  // alert(xhr.responseText);
 } else {
  alert("오류발생 : "+xhr.status);
 }
}
</script>
</head>
<body>
<input type="button" value="클릭1" id="btn">
<div id="first"></div>
</body>
</html>

 

 

 

package jquery.servlet;

import java.io.IOException;
import java.io.PrintWriter;
import java.util.HashMap;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import jquery.dto.MemberDTO;
import jquery.service.MemberService;

import org.json.JSONObject;


public class GetServlet extends HttpServlet {


protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doPost(request, response);
}
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
request.setCharacterEncoding("UTF-8");
String cmd = request.getParameter("command");

System.out.println(cmd);
if(cmd.equals("getJSON")){
getJSON(request,response);
}else if(cmd.equals("getData")){
getData(request, response);
}else if(cmd.equals("run")){
run(request, response);
}else if(cmd.equals("getMemberById")){
getMemberById(request, response);
}else if(cmd.equals("getMemberByIdJson")){
getMemberByIdJson(request, response);
}
}
protected void getMemberById(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//1. 요처파라미터 조회
String id = request.getParameter("id");
//2. B.L. 호출
MemberService ms = new MemberService();
MemberDTO mdto = ms.getMemberById(id);
//3. 응답
String str = "id : "+mdto.getId()+"<br>이름 : "+mdto.getName()+"<br>나이 : "+mdto.getAge();

response.setContentType("text/html;charset=UTF-8");
response.setHeader("Cache-Control", "no-cache");
PrintWriter out = response.getWriter();
out.println(str);
out.close();
}
protected void getMemberByIdJson(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//1. 요처파라미터 조회
String id = request.getParameter("id");
//2. B.L. 호출
MemberService ms = new MemberService();
MemberDTO mdto = ms.getMemberById(id);
//3. 응답
//JSONObject - JSON 객체 형태의 문자열(string)생성
JSONObject jObj = new JSONObject(mdto);
response.setContentType("text/html;charset=UTF-8");
response.setHeader("Cache-Control", "no-cache");
PrintWriter out = response.getWriter();
out.println(jObj.toString());
out.close();
}
protected void run(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String id = request.getParameter("id");
String name=request.getParameter("name");
String isSend = request.getParameter("isSend");
String number = request.getParameter("number");
String str = id+", "+name+", "+isSend+", "+number;
System.out.println(str);
response.setContentType("text/html;charset=UTF-8");
response.setHeader("Cache-Control", "no-cache");
PrintWriter out = response.getWriter();
out.println(str);
out.close();
}
protected void getData(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
response.setContentType("text/html;charset=UTF-8");
response.setHeader("Cache-Control", "no-cache");
PrintWriter out = response.getWriter();
out.println("<b>이것이 답입니다.</b><br>요청방식 : "+request.getMethod());
out.close();
}
protected void getJSON(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
HashMap map = new HashMap();
map.put("id", "abcde");
map.put("name", "홍길동");
map.put("age", 30);
JSONObject jObj = new JSONObject(map);

response.setContentType("text/html;charset=UTF-8");
response.setHeader("Cache-Control", "no-cache");
PrintWriter out = response.getWriter();
out.println(jObj.toString());
out.close();
}

}

접기

* 결과

 

 

 

 

 

http://whakscjs.tistory.com/205

Posted by 물색없는세상