너는 진정 전자인을 아는가?

window.onload = function(){

        //전체주소

/*alert("href : "+$(location).attr('href'));

alert("protocol : "+$(location).attr('protocol'));

alert("host : "+$(location).attr('host'));

alert("pathname : "+$(location).attr('pathname'));

alert("search : "+$(location).attr('search'));

*/

}

참조사이트

<script type="text/javascript">

<!--

$(document).ready(function() {

layer_open('layer1');

});

function layer_open(el) {

var tmp = $.cookie('popup_'+el);

if(tmp!="off"){

$.cookie('popup_'+el, 'on', { path: '/main/', expires: 1 });

}

$("p.pop_close").css({ "cursor":"pointer" });

$("p.today01").css({ "cursor":"pointer" });

var temp = $('#' + el); 

var bg = temp.prev().hasClass('bg'); 

if (bg) {

$("div.layer:not(:animated)").slideToggle("slow");

} else {

temp.css("display","none");

temp.slideDown("slow");

}

temp.find('.pop_close img').click(function(e) {

if (bg) {

$("div.layer:not(:animated)").slideToggle("slow");

} else {

temp.slideToggle("slow");

}

e.preventDefault();

});

$('.layer .bg').click(function(e) {

$("div.layer:not(:animated)").slideToggle("slow");

e.preventDefault();

});

$('.today01 input:checkbox').click(function(e) {

var thisid2 = $(this).attr('id');

thisid3 = thisid2.substring(6,12);

$('#'+thisid3).slideToggle("slow");

e.preventDefault();

$.cookie(thisid2, 'off', { path: '/main/', expires: 1 });

});

}

</script>

<div id="layer1" class="pop-layer1">

<div id="pop_bg">

<div id="pop_wrap">

<div class="flexslider">

 <ul class="slides">

<li>

<a href="#"><img src="../images/main/img1.jpg" alt="" /></a> 

<a href="#"><img src="../images/main/img2.jpg" alt="" /></a>

</li>

<li><img src="../images/main/img1.jpg" alt="" /></li>

 </ul>

</div>

<p class="clr"></p>

<p class="clr"></p>

<p class="today01"><input type="checkbox" name="layer_popup1" id="popup_layer1" value="checkbox" /><label for="popup_layer1"> 오늘 하루 열지 않음</label></p>

<p class="pop_close"><img src="../images/main/btn_close.gif" alt="닫기" /></p>

</div>

</div>

</div>

참고사이트

변수1= $(".클래스명1").find("li").length;

find("li")=li태그를 찾아오고

length = 갯수를 파악한다

변수2 = $(".클래스명1").find("li").eq(0);

eq(0)은 0번째 li안에 id나 기타 값을 가져올수있습니다.

변수1의 갯수가 3이면

eq(0),eq(1),eq(2)

이렇게 값들이 저장되어있습니다.

변수2.attr("src")

변수2에 <li><img src="이미지" /></li>

attr("src") 해당값 가져오기

여기선 이미지를 가져옵니다.

<ul class="클래스명1">

<li><img src="이미지" /></li>

<li><img src="이미지1" /></li>

<li><img src="이미지2" /></li>

</ul>

[jQuery] 클릭시 링크새창열기

[jQuery] 클릭시 태그값 바꾸기

[jQuery] 마우스오버시 레이어 팝업창띄우기

슬라이드 이벤트

$('#header')

.css({ 'top':-50 })

.delay(1000)

.animate({'top': 0}, 800);

$('#footer')

.css({ 'bottom':-15 })

.delay(1000)

.animate({'bottom': 0}, 800);

스크립트 

<header id="header">

<h1>BlocksIt.js | Dynamic Grid Layout jQuery Plugin</h1>

<div id="backlinks">

<a href="../">Back to Home Page &raquo;</a>

<a href="http://www.inwebson.com/jquery/blocksit-js-dynamic-grid-layout-jquery-plugin/">Visit Plugin Article Page &raquo;</a>

</div>

<div class="clearfix"></div>

</header>

<footer id="footer">

<span>&copy; 2012 <a href="http://www.inwebson.com">inWebson.com</a>. Design by <a href="http://www.inwebson.com/contactus">Kenny Ooi</a>. Powered by <a href="http://www.inwebson.com/jquery/">jQuery</a>.More script and css style

: <a href="http://www.htmldrive.net/" title="HTML DRIVE - Free DHMTL Scripts,Jquery plugins,Javascript,CSS,CSS3,Html5 Library">www.htmldrive.net </a></span>

</footer>

클릭시 이미지,기타태그에 대한 값바꾸기

<div id="nn">

<a href="sss"><img src="sss2" alt="alt" /></a>

</div>

여기 a태그를 클릭시 a 태그안 href값이 기억이 된다.

그리고 img 태그 속 src값을 기억하고 싶을때

$("#nn a").click(function(){
  var href = $(this).attr("href");    //href값 기억

  var src = $("#nn a img").attr("src");    //src 값 기억

  $("#main img").attr("src",href);

return false;

});

위 스크립트가 적용이 되면

밑에 기본 값 src="222"가 => 위 값을 받아서 src="sss"로 변화 한다.

<div id="main">

<img src="222" alt="alt" />   

</div>

기타 문의시 댓글달아주세요.

저도 아직잘 모르지만 아는부분은 가르쳐드립니다.

[jQuery] 클릭시 링크새창열기

[jQuery] 해당갯수와 해당안에내용 가져오기

[jQuery] 마우스오버시 레이어 팝업창띄우기