shown here on msi.com 주 이미지를 만들 수있는 방법이 있습니까? 플래시로 작성되었지만 jquery로 처리하는 것을 선호합니다. 나는 또한 '모자이크 생성기'로 시도했지만, 효과를 잘 복제 할 수는 없지만 js와 함께 발전기를 사용할 수도 있습니다.jquery로 모자이크/바둑판 식 이미지 효과 만들기
[편집] 나는 애니메이션에 대해서가 아니라 효과의 타일/모자이크 측면을 에뮬레이션하는 것에 관심이있다. 공백 (또는 색상 맞춤형 테두리)으로 구분 된 큰 이미지 (예 : 400x300px)를 9 개의 동일한 크기의 블록 또는 타일로 나누고 싶습니다.
각 이미지에 개별 호버 효과를 적용하고 각 이미지를 별도의 항목으로 제공하고 싶지만 그 이상의 애니메이션이 필요하지 않습니다.
둥근 모서리는 중요하지 않거나 바람직하지 않습니다. [/ 편집]
jquery로 처리하는 것이 꽤 재미있을 것입니다. 마우스를 올리거나 내려 놓을 때 애니메이션을 토글 한 마우스 오버 이벤트가있는 이미지 테이블을 만들 수 있습니다. 논리는 너무 어렵지 않습니다. 이미지와 애니메이션을 멋지게 보이게하는 것이 조금 힘들지 만 실행 취소 할 수는 없습니다. 효과를 복제하려는 정도에 따라 다릅니다. : D
편집 : 이미지 모자이크 만 원하십니까? 당신은 모든 이미지를 배치하기 위해 테이블을 사용할 수 있으며 이벤트에 js를 사용할 수 있습니다. Js를 원하거나 필요로하는 것은 무엇입니까? : D
아이디어가 있습니다. 큰 이미지를 DIV에로드하십시오. 창의 크기를 결정하고 투명도가있는 PNG를 만들어 창을 원하는 위치에 놓습니다. (두께가있는 테두리의 불투명도로 공백을 얼마나 넓게 사용할 것인지 제어합니다.) 효과를 만들려면 세 개의 레이어를 사용합니다. 아래쪽 레이어의 이미지 (필요에 따라 바꿀 수 있음). 중간 레이어와 최상위 레이어는 x 축과 y 축을 따라 반복되고 jQuery에 의해 개별적으로 제어됩니다. 중간 레이어에는 투명도가있는 PNG가 있고 그 위에 레이어가 단색 (페이지의 배경이 보이지 않는 것처럼 보이는지)하는 상단 레이어가 있습니다. "예쁜"효과를 만들기 위해 불투명도를 조정하거나 별도의 상자의 최상위 레이어에 애니메이션을 적용하여 PNG의 중간 레이어의 투명 영역을 통해 볼 수있는 맨 아래 레이어의 이미지를 표시하거나 숨길 수 있습니다.
희망 사항은 분명합니다. 스마트 코딩을 사용하면 원하는 곳 어디에서나 패키지로 만들고 재사용 할 수 있습니다.
나는 내가 원하는 것을 더 잘 설명 할 수 있도록 내 질문을 편집했다. 간단히 말해서, 나는 단지 타일 효과 & 호버 효과 & 둥근 모서리가 중요하지 않거나 싶지 싶어요. –
안녕하세요, 당신의 답변에 고마워요. 나는 내가하고있는 일이 플래시를 지원하지 않는 휴대 전화에서 볼 수 있다는 것이 중요하기 때문에 자바 스크립트를 사용하고 싶다. 제한된 경험으로 Jquery는 자바 스크립트로 서핑을하는 사람들을 염두에 두지 않을 때 작업하기가 더 쉽습니다. 해결책을 찾은 곳에 대한 자세한 정보는 Michael에게 보내는 내 답변을 참조하십시오. –