저는 nado0124님 사이트가 궁금합니다:)

저는 이곳에 글 남기신 다른 분들처럼 개발 능력도 없고 다른 분들이 배포하신 자료도 제대로 이용하기 어려운 1인입니다.

가끔 글자색이나 밑줄 넣는 법 등 기초적인 질문하다 핀잔 듣기도 하고요... ^^;

또 요청이나 피드백 했다가 야단(?) 맞기도 합니다...

그래서 애니즌님이 제가 간단하게 쓴 글을 읽고, 계속 테스트 하시면서 문제를 찾아주시던 기억이 특별했습니다.

XE포럼 이미지 레이지로드 처음 배포하셨을 때였죠.

너무 적극적이셔서 제가 당혹스러웠습니다.ㅎㅎ

가끔 애니즌님 처럼 열정적이신 분들과 적절한 피드백을 교환하면, 프로그래 개선에 긍정적인 것 같습니다.

(개발자분들이 부담스럽거나 힘들지 않게 조심해서 피드백을 해야 하는데 그게 어렵더라구요.)

개발자들은 무리한 피드백은 미뤄둡니다. 가능할때 하거나 아예 안하는 방향으로 가기 때문에 여러가지 피드백을 들고 가면 반영이 되는 것이 있고 안되는 것이 있을거에요. :D

개발자분들에 따라 어떤 분들은 개선 등을 위해 피드백을 원하시는 경우도 있는데, 개발자분들 마다 피드백 원하는지, 원치 않는지, 어느 정도의 피드백이 가능한지 모르기에 점점 피드백을 못하게(?) 되네요.^^

작고 간단한 개선점을 알려드리면 좋을 것 같은 경우에도 알려드리기 어려운... 몇몇 피드백을 받는 분들께만 조심해서, 아주 조심해서 하게 됩니다. 개발자분들께 무례하게 하여 상처를 주는 경우가 많다는게 슬프죠...

저같은 경우는 피드백 내놔!! 해도 피드백을 안주셔서 슬픕니다. 물론 개발자마다 다르죠.

조심스럽게 부탁하면 될 지도... 한번 물어보세요.

폐기라면... 아예 없애는건가요?

슬픈일이네요.ㅠㅠ

개발 능력이 있는 분들이라 폐기도 가능한가 봅니다.

몇개는 시안 단계에서 탈락해서 아예 제작되지 않거나, 제작 뒤에 뭔가 맘에 들지 않으면 가차없이 지워버리는 성격인지라... ㅋㅋ

생각나면 찍어낸다는 수준은 정말 1년에 2~3개도 안 만든다는 소리입니다. ㅋㅋㅋㅋㅋㅋ

레이아웃 이야기가 나와서 말인데

짜고 있는 것에 대해 어떻게 생각하시는지...

평소에는 이렇게 투명하게 뜹니다.

메뉴에 마우스 오버를 하면

이런식으로 서서히 투명도가 1이 됩니다.

애니즌님 생각은 어떠신지... ?_?

저 망할 a태그가 마우스 오버를 안하면 다시 원래값으로 돌아가는건...해결해야겠지만요 ㅋㅋㅋㅋ

그냥 고정이 낫지 않나요~? 굳이 아이디어를 내자면

스크롤 하면 한 줄 정도? 만 나오고 마우스를 오버하면 메뉴바가 스르르륵 내려와서 보여주면 좋겠군요:)

ㅋㅋㅋ 주소는 지웠습니다. 보신 주소가 커뮤니티 사이트가 될 거심니다. 낄낄

음.. 오히려 집중이 덜 될 것 같은 생각입니다. (개인적인 견해)

아예 처음에는 알파 100%으로 하고

스크롤이 내려가면 알파 0으로 하고~ 마우스를 올리면 100%~ 뭐 이런 느낌으로 하면 어떨까요?

물론 다시 상단으로 가면 100%가 되어야겠지요~

그것도 괜찮겠네여. 일단 마무리 짓고 삽질을 해봐야겠어요 ㅋㅋ

$(window).scroll() 요녀석을 쓰면 될 겁니다 :)

대충 짜자면

jQuery(function($){

	var $target = $('#header'),
		$targetTop = $target.scrollTop() + $target.height();

	$(window).scroll(function () {

		var winTop = $(this).scrollTop();

		if (winTop > $targetTop) {	
			$target.fadeTo(0,0.5);
		}else if (winTop <= $targetTop){	
			$target.fadeTo(1,0.5);			
		}
	});
});

감사합니당 XD

헐 다 짜오셨어...

다시 확인요. 오버했을 떄~ 뭐 이건 따로 만드시면 될 듯..

저 대신 갈려주시다니...ㅋㅋㅋㅋ

오버 하는 녀석은

$target.hover(function(){

$(this).fadeTo(1,0.5);

},function(){

$(this).fadeTo(0,0.5);

});

이러면 될겁니당.

css로 transform주면 될 듯 싶네영 ㅋㅋ

하나로 합치면

대충 이렇게..?

jQuery(function($){
 
    var $target = $('#header'),
        $targetTop = $target.scrollTop() + $target.height();
 
	$target.hover(function(){	 
		$(this).fadeTo(0.5,1);	 
	},function(){	 
		$(this).fadeTo(0.5,0);	 
	});

    $(window).scroll(function () {
 
        var winTop = $(this).scrollTop();
 
        if (winTop > $targetTop) {   
            $target.fadeTo(0.5,0);
        }else if (winTop <= $targetTop){ 
            $target.fadeTo(0.5,1);
        }
    });
});

테스트는 안해봤지만.. 문제는 없을 것으로...

div.gnb_cover
{
    /*animate*/
    -ms-transition:all .8s;
    -moz-transition:all .8s;
    -webkit-transition:all .8s;
    transition:all .8s;
   
    position:fixed;
    height:40px;
    width:100%;
    line-height:40px;
    background-color:#526BBE;
    /*opacity:.25;*/
   
    z-index:99999;
}
/*
div.gnb_cover:hover
{
    opacity:1;
}
*/

이렇게 해놓긴 했었는데 ㅋㅋ 제이쿼리랑 엮어야겠네용

방금 코드 다시 수정했습니다.

fadeTo를 잘못 해놨네요.. 딜레이, 알파값인데 알파값, 딜레이로 했ㅇㅁ....-_-;;

그냥

div.gnb_cover:hover
{
opacity:1;
}

이 부분 없애도 될겁니다.

이러면 완성 ?

jQuery(function($){
  
    var $target = $('div.gnb_cover'),
        $targetTop = $target.scrollTop() + $target.height();
  
    $target.hover(function(){    
        $(this).fadeTo(0.5,1);   
    },function(){    
        $(this).fadeTo(0.5,0);   
    });
 
    $(window).scroll(function () {
  
        var winTop = $(this).scrollTop();
  
        if (winTop > $targetTop) {   
            $target.fadeTo(0.5,0);
        }else if (winTop <= $targetTop){ 
            $target.fadeTo(0.5,1);
        }
    });
});

코드 줍줍 + 3 +

확실하진 않지만 jquery로 변형 된 녀석들은 css로 컨트롤하기가 어렵더군요

조금 다듬어서 적용했는데 잘 되네영 마저 짜야겠어여 ㅋㅋ

/**
	@author Anizen
	*/
	var $target = $('#gnb_cover'), $targetTop = $target.scrollTop() + $target.height();

	$(window).scroll(
	function ()
	{
		var winTop = $(this).scrollTop();
		if (winTop > 150) 
		{
			fadeTopmenu(true);
		}
		else// if (winTop <= $targetTop)
		{
			fadeTopmenu(false);
		}
	});

	function fadeTopmenu (boolean)
	{
		if(boolean)
		{
			$target.css('opacity',0);

			$target.hover(
			function()
			{    
				$(this).css('opacity',1);
			},
			function()
			{    
				$(this).css('opacity',0);
			});
		}
		else
		{
			$target.css('opacity',1);
		}
	}
	/* end */

아직 손을 더 봐야겠으요 ㅜㅜ

마우스 올려서 다시 나타나는건

$target.hover(function()
            {   
                $(this).css('opacity',1);
            });
           
            $target.mouseleave(function()
            {
                $(this).css('opacity',0);
            });

이렇게 수정했...

<script>
jQuery(function($){   
	//대상설정
    var $target = $('#gnb_cover'),
		// 대상의 위치값 + 높이값 구하기
        $targetTop = $target.scrollTop() + $target.height(),
		// 현재 스크롤 값이 저장될 녀석
		winTop = 0;
   

    $target.hover(function(){    
		// 마우스를 올리면 알파값을 서서히 채워준다.
        $(this).fadeTo(0.5,1);   
    },function(){
		//현재 스크롤이 타겟 높이값보다 내려갔을 때만 알파값을 서서히 빼기
		if(winTop > $targetTop) $(this).fadeTo(0.5,0);   
    });
  
	// 스크롤 이벤트
    $(window).scroll(function () {
		//스크롤이 될 떄마다 winTop에 스크롤값을 저장
        winTop = $(this).scrollTop();

		//타겟 높이값 보다 현재 스크롤값이 클 경우
        if (winTop > $targetTop) {   
			//대상 알파값을 서서히 빼준다.
            $target.fadeTo(0.5,0);

		//타겟 높이값 보다 현재 스크롤값이 같거나 작을 경우
        }else if (winTop <= $targetTop){
			//대상 알파값을 서서히 채워준다.
            $target.fadeTo(0.5,1);
        }
    });
});
</script>

css를 조정해준 이유는.... 스크롤 계속 내리거나 올리는 상태면 사라지다 말아서 ㅋㅋㅋㅋㅋㅋ

확인은 안해봤는데 이렇게 하면 되지 않을까요?

<script>
jQuery(function($){   
	//대상설정
    var $target = $('#gnb_cover'),
		// 대상의 위치값 + 높이값 구하기
        $targetTop = $target.scrollTop() + $target.height(),
		// 현재 스크롤 값이 저장될 녀석
		winTop = 0;

   

    $target.hover(function(){    
		// 마우스를 올리면 알파값을 서서히 채워준다.
        $(this).fadeTo(0.5,1);   
    },function(){
		//현재 스크롤이 타겟 높이값보다 내려갔을 때만 알파값을 서서히 빼기
		if(winTop > $targetTop) $(this).fadeTo(0.5,0);   
    });
  
	// 스크롤 이벤트
    $(window).scroll(function () {
		//스크롤이 될 떄마다 winTop에 스크롤값을 저장
        winTop = $(this).scrollTop();

		//타겟 높이값 보다 현재 스크롤값이 클 경우
        if (winTop > $targetTop) {   
			//대상 알파값을 서서히 빼준다.
            if($target.css('opacity') == 1) $target.fadeTo(0.5,0);

		//타겟 높이값 보다 현재 스크롤값이 같거나 작을 경우
        }else if (winTop <= $targetTop){
			//대상 알파값을 서서히 채워준다.
            if($target.css('opacity') == 0) $target.fadeTo(0.5,1);
        }
    });
});
</script>

가감시키면서 적용해볼게영 +_+...

전 jquery사용한지 얼마 안되서 큰 문제 없더라구요 -0-;;

(●・８・●)