웹사이트 검색
jquery - 자바스크립트를 사용하여 상속된 CSS 값을 어떻게 가져올 수 있나요?
자바스크립트를 사용하여 상속된 CSS 속성의 값을 얻으려고 하고 있습니다. 포괄적인 답변을 찾지 못했습니다.
예시 CSS:
div { width: 80%; }예시 마크업:
<div id="mydiv"> Some text </div>자바스크립트(jQuery 또는 네이티브)를 사용하여 요소의 너비를 가져와야 합니다 -- 픽셀이 아니라 문자열 "80%"로.
$('#mydiv 더 많은 것을 읽으십시오 →자바스크립트 - CSS 위치 고정. Div 래퍼는 수직으로 고정되어야 하지만 수평으로는 변해야 합니다
저는 이런 식의 div가 있습니다
#footer { position:fixed; left:40px; top:0px; }세로 또는 가로로 스크롤할 때 위치가 고정됩니다. 하지만 사용자가 스크롤바를 세로로 스크롤할 때는 div가 고정되고, 사용자가 스크롤바를 가로로 스크롤할 때는 변화되기를 원합니다.
저는 몇몇 포럼과 게시물을 봤지만 대부분은 jQue
더 많은 것을 읽으십시오 →javascript - HTML + CSS로 eBay 새 로고 페이지를 재현하는 방법
저는 웹사이트에 대한 훌륭한 아이디어가 있었고, eBay가 새 로고를 위해 만든 페이지가 매우 흥미롭다고 생각합니다. 제가 그걸 어떻게 재현할 수 있을지에 대해 누군가가 조언을 해줄 수 있는지 궁금합니다.
http://pages.ebay.com/announcements/new/index.html
나는 간격을 통해 볼 수 있는 로고가 메인 배경으로 설정되어 고정되어 있고, 앞쪽 섹션은 그 위를 그냥 스크롤하는 것이라고 대략 이해합니다.
두 가지 주요 질문:
- 그들은 'front' div가 페이지를 채우도록 어떻게 하나요 더 많은 것을 읽으십시오 →
자바스크립트 - CSS 클래스 복제
모든 :hover 클래스를 .hoverid 클래스에 복사하고 싶습니다. 여기서 id는 요소의 인덱스(또는 고유한 hover 클래스 이름을 만드는 다른 방법)를 의미합니다.
그래서 제 아이디어는 페이지상의 모든 :hover가 정의된 요소들을 반복하여 그 클래스를 .hoverid로 복제하는 것이었습니다. 이렇게 하면 원하는 요소에서 다음과 같이 호버 효과를 트리거할 수 있습니다:
$('#element').addClass('hover'+$(this).id);그래서 제 질문(들)은 사실 다음과 같습니다:
- ':hover'가 정의된 요소를 반복하는 방법은?
- 그 클래스를 다른 클래스로 복제하는 방법은?
해결책을 시도해볼 수 있는 피들: http://jsfi
더 많은 것을 읽으십시오 →javascript - css3pie가 DOM을 망쳐서 jQuery 선택자 오류가 발생함
IE 6/7/8에서 CSS3 효과(border-radius, box-shadow...)를 적용하기 위해 저는 css3pie를 사용하고 있습니다.
그러나 css3pie는 DOM에 일부 css3-container (v1)/css3pie (v2) 태그를 생성하여 예상된 구조를 혼란스럽게 합니다. 예시는 다음과 같습니다:
CSS
pre { border: 1px solid #aaa; border-radius: 더 많은 것을 읽으십시오 →javascript - CSS에서 nth 열을 선택할 수 있나요?
저는 4개의 CSS columns가 있는 div가 있고, 텍스트와 background-image 사이의 대비가 좋지 않아서 3번째와 4번째 컬럼의 텍스트를 약간 더 어둡게 만들고 싶습니다. 이게 가능할까요? CSS나 JS 솔루션은 모두 받아들일 수 있습니다.
여기 데모가 있습니다.
--편집--
내가 말하자면, 의사 블록(pseudo blocks)에 대한 셀렉터를 찾는 것은 불가능해 보이지만, 브라우저 크기가 조정될 때 텍스트를 균등하게 나누는 반응형 블록(열처럼)을 만드는 방법을
더 많은 것을 읽으십시오 →javascript - CSS3 컬럼에서 텍스트 가져오기?
저는 프로젝트에서 CSS3의 컬럼 지원을 사용하고 있습니다(지금까지는 대부분의 자바스크립트 솔루션보다 훨씬 더 견고하고 신뢰할 수 있다는 것을 발견했습니다).
질문: 특정 열에 있는 텍스트를 어떤 식으로든 얻는 것이 가능합니까?
답변 #1
그리고… 뭐, 두 달 후에? 나는 마침내 이 질문에 대한 답을 찾았다. 이는 document.caretRangeFromPoint(Webkit) 또는 document.caretPositionFromPoint에 의존한다.
var ge 더 많은 것을 읽으십시오 →HTML, CSS 및/또는 Javascript로 증명 트리를 어떻게 표시합니까?
웹 페이지 내에서 자연 연역 스타일의 증명 트리를 표시하고 싶습니다. 데이터를 JSON 파일에서 가져올 것입니다.
이런 것을 표시하는 가장 좋은 방법은 무엇인가요? CSS만으로 가능한가요? 아니면 이런 것을 할 수 있는 라이브러리가 있나요? 결국 인터랙티브해야 하기 때문에 이미지를 렌더링하는 것은 불가능합니다. 또한 이 트리가 꽤 커질 수 있다는 점도 언급해야 합니다.
예시 :
업데이트: 최종 결과가 어떻게 보여야 하는지에 대한 더 나은 예:
더 많은 것을 읽으십시오 →자바스크립트 - CSS 선풍기 애니메이션
저는 부채 같은 애니메이션을 적용하고 싶은 세 가지 다른 이미지가 있습니다.
저는 이미지를 포토샵에서 합칠 수 없습니다. 왜냐하면 이미지를 하나씩 순서대로 나타나게 하고 싶기 때문입니다.
이것이 코드입니다 (코드에서 더미 이미지를 사용했습니다)
.bannerimg{ position:relative; } .bannerimg img{ position:absolute; max-width:500px; } .bannerimg .bannerhtml{ -ms-transform: rotate(300deg); /* IE 9 */ -webkit-transform: rotate(300deg); /*
더 많은 것을 읽으십시오 →자바스크립트를 사용하여 이미지에서 그레이스케일 CSS 필터 제거하기
저는 일부 이미지를 순차적으로 확인하면서 하나씩 필터를 제거하려고 하고 있습니다.
var h = 0; function removeGreyscale() { document.images[h].style.webkitfilter = "grayscale(0)"; document.images[h].style.filter = "grayscale(0)"; h += 1; if (h === 8) { h = 0; } } setInterval(removeGreyscale, 3000); 더 많은 것을 읽으십시오 →