div를 클릭 가능하게 만드는 방법은 무엇입니까?

Madhumitha

전체 div를 클릭 가능하게 만들기

몇 개의 링크를 확인했습니다. 나는 그것을 이해했지만 그것은 내 일이 아닙니다.

내 코드 스 니펫은 다음과 같습니다.

$('.Quiz').click(function(){
  window.location=$(this).find('a').attr('href');
  return false;
})
.Portfolio {
    background-color: #ffffff;
    width: 920px;
    margin: 0 auto;
    position: relative;

    margin-top: 120px;
    margin-bottom: 50px;

    border-style: solid;
    border-color: #dddddd;

    border-width: 2px;

    padding-left: 20px;
    padding-right: 20px;

    overflow: auto;
}

.port {
    color: #4aaaa5;
    border-style: solid;
    border-color: #cccccc;

    border-width: 2px;
    border-left-style: hidden;
    border-right-style: hidden;
    border-top-style: hidden;
}

.container_img  img{
    float:left;
    margin: 0 auto;
    padding: 20px;
    width: 230px;
    height: 230px; 
    position: relative;

}

.container h1 {
    float:left;
    position:relative;
    padding: 20px;
}

.Books{
    clear:left;
}

.Books h1{
    clear:left;
}

.Kernel{
    clear: left;
}

.Kernel h1{
    clear: left;
}

.clear {
    clear: both;
}

.text_m h1{
    position: absolute;
    margin: 0 auto;
    text-align: center;
    color: white;

    background: #4aaaa5;
    opacity: 0.7;
    width:210px;

    margin-top: 200px;
    padding-left: 20px;
    margin-left: 20px;
}

.text_e h1{
    display: inline-block;
    position: relative;

    text-align: center;
    color: white;

    background: #4aaaa5;
    opacity: 0.7;
    width:230px;

    margin-top: 200px;
    right: 250px;

}

.text_b h1{
    position: absolute;
    text-align: center;
    color: white;

  
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="Portfolio">

<div class="port"> 
    <h1> Portfolio </h1>
</div>  

<div class="container_img"> 
    <div class="Quiz"> 
        <a href="https://madhumitha.github.io/Quiz/"></a>
        <img  src="assets/images/quiz.jpg" alt="Quiz">
            <div class='text_m'> 
                <h1> Quiz Time </h1>
            </div>
    </div>


    <div class="Weather"> 
        <img src="assets/images/Weather.jpg" alt="Weather">
            <div class='text_e'>
                <h1 id='weather'> Weather </h1>
            </div>
    </div>

    <div class="Books">
        <img src="assets/images/space.jpg" alt="Space"> 
            <div class='text_b'>
                <h1> ISS-Tracker </h1>
            </div>
    </div>

    <div class="Photography">
        <img src="assets/images/Photography.jpg" alt="Photography">
            <div class='text_p'>
                <h1> Photography </h1>
            </div>
    </div>

    <div class="Kernel">
        <img src="assets/images/Kernel.jpg" alt="Kernel">
            <div class='text_k'>
                <h1> Kernel </h1>
            </div>
    </div>

    <div class="clear"></div>
    </div>           
</div>

첫 번째 이미지를 클릭 할 수 있도록 div를 만들려고합니다. 나는 무엇이 잘못되었는지 알아낼 수 없습니까? 클릭 이벤트가 CSS에서 부동 및 지우기와 함께 작동하지 않습니까?

abney317

HTML5 에서는 태그 div내부에 삽입하는 것이 완벽하게 유효합니다 a.

<a href="https://madhumitha.github.io/Quiz/">
  <div class="Quiz"> 
    <img  src="assets/images/quiz.jpg" alt="Quiz">
    <div class='text_m'> 
      <h1> Quiz Time </h1>
    </div>
  </div>
</a>

이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.

침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제

에서 수정
0

몇 마디 만하겠습니다

0리뷰
로그인참여 후 검토

관련 기사

분류에서Dev

createElement ( 'IMG')를 클릭 가능하게 만드는 방법은 무엇입니까?

분류에서Dev

전체 div를 클릭 가능하게 만드는 방법은 무엇입니까?

분류에서Dev

부모 div 만 클릭 가능하게 만드는 방법은 무엇입니까?

분류에서Dev

Datebox Jquery 모바일 입력 필드를 클릭 가능하게 만드는 방법은 무엇입니까?

분류에서Dev

Hashmap을 사용하여 Android ListView를 클릭 가능하게 만드는 방법은 무엇입니까?

분류에서Dev

MaterialAlertDialogBuilder에서 ClickableSpan 링크를 클릭 가능하게 만드는 방법은 무엇입니까?

분류에서Dev

캔버스에서 EditText를 클릭 가능하게 만드는 방법은 무엇입니까?

분류에서Dev

HTML에서 캔버스 요소를 클릭 가능하게 만드는 방법은 무엇입니까?

분류에서Dev

swiper.js 이미지를 클릭 가능하게 만드는 방법은 무엇입니까?

분류에서Dev

navbar의 로고를 "클릭 가능"하게 만드는 방법은 무엇입니까?

분류에서Dev

navBar의 headingText를 클릭 가능하게 만드는 방법은 무엇입니까?

분류에서Dev

클릭 가능한 캔버스를 사용하여 비트 맵을 만드는 방법은 무엇입니까?

분류에서Dev

전체 div를 클릭 가능하게 만들면서 현재 스타일을 유지하는 가장 좋은 방법은 무엇입니까?

분류에서Dev

웹 사이트를 흐리게 처리하고 웹 사이트를 "클릭 가능"하게 만드는 방법은 무엇입니까?

분류에서Dev

전체 div를 클릭 가능하게 만드는 방법

분류에서Dev

Kivy ActionBar Button이 클릭으로 뭔가를하게 만드는 방법은 무엇입니까?

분류에서Dev

동적 HTML 테이블 데이터 (jQuery를 사용하여 생성됨)를 클릭 가능하게 만드는 방법은 무엇입니까?

분류에서Dev

Android에서 클릭 및 편집 가능한 텍스트 필드를 만드는 방법은 무엇입니까?

분류에서Dev

forEach 루프에서 클래스를 실행 가능하게 만드는 방법은 무엇입니까?

분류에서Dev

이미지의 중심 만 -animation png- 클릭 가능하게 만드는 방법은 무엇입니까?

분류에서Dev

자바 스크립트에서 셀 테이블에 대해 href 링크를 클릭 가능하게 만드는 방법은 무엇입니까?

분류에서Dev

불규칙한 모양 구성 요소를 클릭 가능하게 만드는 방법은 무엇입니까? 기계적 인조 인간

분류에서Dev

두 번째 클릭으로 div를 만드는 방법은 무엇입니까?

분류에서Dev

SVG 파일에서 클릭 가능한지도를 만드는 방법은 무엇입니까?

분류에서Dev

TextView에서 클릭 가능한 링크를 만드는 방법은 무엇입니까?

분류에서Dev

impress.js에서 클릭 가능한 링크를 만드는 방법은 무엇입니까?

분류에서Dev

bash : 쿼리 매개 변수로 클릭 가능한 링크를 만드는 방법은 무엇입니까?

분류에서Dev

QPushButton을 한 번 클릭 할 때 편집 가능한 텍스트를 만드는 방법은 무엇입니까?

분류에서Dev

목록보기를 클릭 가능하게 만들고 클릭 한 항목에서 삭제할 수있는 방법은 무엇입니까?

Related 관련 기사

  1. 1

    createElement ( 'IMG')를 클릭 가능하게 만드는 방법은 무엇입니까?

  2. 2

    전체 div를 클릭 가능하게 만드는 방법은 무엇입니까?

  3. 3

    부모 div 만 클릭 가능하게 만드는 방법은 무엇입니까?

  4. 4

    Datebox Jquery 모바일 입력 필드를 클릭 가능하게 만드는 방법은 무엇입니까?

  5. 5

    Hashmap을 사용하여 Android ListView를 클릭 가능하게 만드는 방법은 무엇입니까?

  6. 6

    MaterialAlertDialogBuilder에서 ClickableSpan 링크를 클릭 가능하게 만드는 방법은 무엇입니까?

  7. 7

    캔버스에서 EditText를 클릭 가능하게 만드는 방법은 무엇입니까?

  8. 8

    HTML에서 캔버스 요소를 클릭 가능하게 만드는 방법은 무엇입니까?

  9. 9

    swiper.js 이미지를 클릭 가능하게 만드는 방법은 무엇입니까?

  10. 10

    navbar의 로고를 "클릭 가능"하게 만드는 방법은 무엇입니까?

  11. 11

    navBar의 headingText를 클릭 가능하게 만드는 방법은 무엇입니까?

  12. 12

    클릭 가능한 캔버스를 사용하여 비트 맵을 만드는 방법은 무엇입니까?

  13. 13

    전체 div를 클릭 가능하게 만들면서 현재 스타일을 유지하는 가장 좋은 방법은 무엇입니까?

  14. 14

    웹 사이트를 흐리게 처리하고 웹 사이트를 "클릭 가능"하게 만드는 방법은 무엇입니까?

  15. 15

    전체 div를 클릭 가능하게 만드는 방법

  16. 16

    Kivy ActionBar Button이 클릭으로 뭔가를하게 만드는 방법은 무엇입니까?

  17. 17

    동적 HTML 테이블 데이터 (jQuery를 사용하여 생성됨)를 클릭 가능하게 만드는 방법은 무엇입니까?

  18. 18

    Android에서 클릭 및 편집 가능한 텍스트 필드를 만드는 방법은 무엇입니까?

  19. 19

    forEach 루프에서 클래스를 실행 가능하게 만드는 방법은 무엇입니까?

  20. 20

    이미지의 중심 만 -animation png- 클릭 가능하게 만드는 방법은 무엇입니까?

  21. 21

    자바 스크립트에서 셀 테이블에 대해 href 링크를 클릭 가능하게 만드는 방법은 무엇입니까?

  22. 22

    불규칙한 모양 구성 요소를 클릭 가능하게 만드는 방법은 무엇입니까? 기계적 인조 인간

  23. 23

    두 번째 클릭으로 div를 만드는 방법은 무엇입니까?

  24. 24

    SVG 파일에서 클릭 가능한지도를 만드는 방법은 무엇입니까?

  25. 25

    TextView에서 클릭 가능한 링크를 만드는 방법은 무엇입니까?

  26. 26

    impress.js에서 클릭 가능한 링크를 만드는 방법은 무엇입니까?

  27. 27

    bash : 쿼리 매개 변수로 클릭 가능한 링크를 만드는 방법은 무엇입니까?

  28. 28

    QPushButton을 한 번 클릭 할 때 편집 가능한 텍스트를 만드는 방법은 무엇입니까?

  29. 29

    목록보기를 클릭 가능하게 만들고 클릭 한 항목에서 삭제할 수있는 방법은 무엇입니까?

뜨겁다태그

보관