숨겨진 항목을 표시하기위한 호버 설정

Question

차를 선택했을 때 메르세데스 벤츠 캐나다와 비슷한 메뉴 선택을 설정하려고합니다. (http://www.mercedes-benz.ca/content/canada/mpc/mpc_canada_website/en/home_mpc/passengercars.flash.skipintro.html).

나는 그것을 여기에서 만들었다 http://jsfiddle.net/sofew/db2BF/3/ 나는 쿠페 표제 위에 마우스를 올려 놓고 싶다. 그리고 정보와 그림은 쿠페 목록 항목으로 바뀔 것이다.

jquery의 다양한 형태를 시도했지만 희망하는 방식대로 작동하지 않는 것처럼 보입니다. 누군가가 올바른 방향으로 나를 가리킬 수 있습니까?

Answer 1

커서를 올려 놓은 요소를 기준으로 메뉴를 표시하려면 AJAX를 사용해야합니다. jQuery에서 load() 메서드를 사용하여 선택한 요소를 AJAX 쿼리의 반환 값으로 채울 수 있습니다.

이것은 하나의 숨겨진 요소 만 필요하다는 것을 의미하며 onhover 이벤트가 발생하면 div가 지워지고 AJAX 데이터로 채워진 다음 표시됩니다. 적절한 데이터를 반환 할 수 있도록 AJAX 쿼리를 수락하는 메서드에 ID 또는 차량 이름을 전달하면됩니다.

서버 측 언어를 지정하면 AJAX 호출에 익숙하지 않은 경우보다 구체적인 예를 제공 할 수 있습니다.

편집 :

아약스는 정말 쉽습니다! Ajax가하는 일은 웹 서버에서 함수를 호출 한 다음 그 호출의 결과를 가져 와서 페이지 자체를 다시로드 할 필요없이 페이지의 어딘가에 넣는 것입니다. Linux를 사용 중이며 PHP를 사용중인 경우 페이지에 현재 서버 시간을 표시한다고 가정 해 봅시다. 당신은 ... 같은

public function WhatTimeIsIt() 
{ 
    return time(); 
} 

을하는 기능을하고 다음 ID가 "시간"과 함께 페이지에 사업부를 만들 수 있습니다. 그런 다음 당신이해야 할 모든 당신의 jQuery를에 다음 호출을 사용

[event handler] { 
    $('#time').load([path to the WhatTimeIsIt() function]); 
} 

그리고 주어진 이벤트 핸들러가 발사 될 때 지금, 당신의 시간의 사업부는 현재 서버 시간을 포함하도록 업데이트됩니다. 아주 간단한 예입니다 만, 자동차 ID를 매개 변수로 사용하는 함수를 만든 경우 자동차의 모든 정보를 가져 와서 멋진 HTML 형식으로 반환하고 반환하면 해결할 수 있습니다.

Answer 2

다음과 같이 사용할 수있는 데모를 만들었습니다 : http://jsfiddle.net/DFXZn/22/.

$ .ajax를 사용하여 콘텐츠를 가져 오는 것이 좋습니다. Ajax 통화에 대해 자세히 알아 보려면 여기를 방문하십시오 : http://api.jquery.com/category/ajax/. 이것이 도움이되는지 알려주십시오. 해피 코딩!