Clickable Div Block

Joined
Mar 25, 2021
Messages
28
Reaction score
0
Hi, I have this theme where an image, and some text are two separate blocks that share the same link so they currently operate separately and I wanted to get it where I could just click the main block and have it act as one link. I was trying out the following type of solution but it doesn’t seem to work wondering if anyone has any ideas how I could sort this out? The theme spits out a lot of code but I was trying to target the class that encompasses the two links, and then find the href link inside and assign a .click to the master div if that makes sense?

Code:
// page init
jQuery(function(){
    initBlockLink();
});

// block link
function initBlockLink() {
    jQuery('.single-wrapper').click(function(){
        window.location=$(this).find('a').attr('href');
        return false;
    });
}



<div class="wpb_column pos-middle pos-center align_center column_child col-lg-6 col-md-33 single-internal-gutter">
    <div class="uncol style-light">
        <div class="uncoltable">
            <div class="uncell no-block-padding">
                <div class="uncont" style="max-width:70%;">
                    <div class="uncode-single-media  text-left animate_when_almost_visible bottom-t-top" data-speed="1000">
                        <div class="single-wrapper" style="max-width: 100%;">
                            <div class="uncode-single-media-wrapper single-advanced">
                                <div class="tmb tmb-light tmb-text-showed tmb-overlay-text-anim tmb-content-left tmb-image-anim  tmb-img-ratio tmb-content-under tmb-media-first tmb-no-bg has-no-control">
                                    <div class="t-inside">
                                        <div class="t-entry-visual">
                                            <div class="t-entry-visual-tc">
                                                <div class="t-entry-visual-cont">
                                                    <div class="dummy" style="padding-top: 80%;"></div><a tabindex="-1" href="http://www.google.com" class="pushed">
                                                        <div class="t-entry-visual-overlay">
                                                            <div class="t-entry-visual-overlay-in style-dark-bg" style="opacity: 0.01;"></div>
                                                        </div>
                                                        <div class="fluid-object h2 font-699849 font-weight-500 is-no-control no-control-mobile-autoplay hasnt-poster object-size self-video" style="padding-top: 80%">
                                                            <div style="width: 640px;" class="wp-video"><video data-keepplaying class="wp-video-shortcode" id="video-131082-2" width="640" height="360" loop="1" autoplay="1" preload="metadata" muted="muted" playsinline>
                                                                    <source type="video/mp4" src="https://domain.com/wp-content/uploads/2023/10/video.mp4" /></video></div>
                                                        </div>
                                                    </a>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="t-entry-text">
                                            <div class="t-entry-text-tc single-block-padding">
                                                <div class="t-entry">
                                                    <h3 class="t-entry-title h2 font-699849 font-weight-500"><a href="http://www.google.com">Screen Recording 2023-10-10 at 11.00.10 AM</a></h3>
                                                    <p class="t-entry-excerpt ">Description Custom Text</p>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
 
Joined
Jul 4, 2023
Messages
357
Reaction score
41
Almost good ;)
JavaScript:
window.location.href = $(this).find('a').attr('href');

// or
window.location.assign( $(this).find('a').attr('href') );

JavaScript:
$(document).ready(function() {
    initBlockLink();
});

function initBlockLink() { // block link
    $('.single-wrapper').click(function() {
        window.location.href = $(this).find('a').attr('href');
    });
}
JavaScript:
$(document).ready(function() {
    initBlockLink();
});

function initBlockLink() { // block link
    $('.single-wrapper').click(function() {
        window.location.assign( $(this).find('a').attr('href') );
    });
}
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,755
Messages
2,569,536
Members
45,009
Latest member
GidgetGamb

Latest Threads

Top