2014-11-07 3 views
0

내가하고 싶은 일은 그 위에 마우스를 올리면 이미지가 커지게 만드는 것입니다. CSS에서 :hover으로 간단하게 처리 할 수 ​​있지만 주변 내용을 푸시하지 않기를 바랍니다. 나는 또한 이미지가 왼쪽 상단 모서리가 아닌 중심에서 자랍니다 것을 선호합니다. 아마도 CSS와 많은 미디어 쿼리 (주변 요소의 위치가 윈도우 너비에 따라 다름)로 시간을 보내면서 매우 지저분하지만 기능적 코드가 발생할 수 있습니다. 그러나 Javascript 또는 Jquery에서이 작업을 수행하는 간단한 방법이 있다면 훨씬 더 좋습니다. 누구든지이 일을하는 좋은 방법을 알고 있습니까?자바 스크립트가 아닌 이미지를 확대합니다.

+0

실례지만, JS 또는 JQuery 솔루션은 CSS를 사용하여 결국 문제를 해결하지 않겠습니까? OTOH, 그 해결책은 복잡 할 수 있고 JS/JQuery 라이브러리는 당신의 삶을 훨씬 쉽게 만들 수 있습니다. 그래서 저는 그 매력을 이해합니다. –

+0

아마도 토글()과 같은 일부 요소는 CSS를 방해하지 않는 것으로 보입니다. 어쨌든 지루함없이 몇 시간 동안 작동하게되면 CSS에 어떤 영향을 미치는지 정말 신경 쓰지 않습니다. Javascript 나 JQuery가 간단한 해결책을 가지고있는 것처럼 보이는이 시점에서 필자의 주요 관심사는 소요 시간을 최소화하는 것이다. – Turtleman579

답변

1

요소 위로 마우스를 가져 가면 transform:scale()을 사용하면됩니다. 그것은 주변 콘텐츠를 밀어 내지 않을 것이고 주어진 요소의 위치에 따라 중심에서부터 확장되어야합니다.

+0

감사합니다. IRC의 누군가 나에게 똑같은 답을주었습니다. 그래서 엉뚱한 자세를 보여 주신 것에 감사드립니다. 어쨌든, 이것이 제가 원했던 것입니다. – Turtleman579

관련 문제