CODEWITHSUNDEEP
javascripthyperlink
user3127127
user3127127

Reputation: 43

hyperlink doesn't open in a new tab

i redesign my website and i have a problem with a hyperlink see my code i think the problem is in the js

<li class="product aopc">
        <a class="product-link"></a>
        <div class="product-details mCustomScrollbar">
    <a target="_blank" href="my link in pdf"><i class="material-icons">picture_as_pdf</i></a>
    </li>

and a part of my js

// handle click events
$container.on( 'click', '.product', function( event ) {
    var $this = $( this );

    event.preventDefault();

    // if not already open, do so
    if ( !$this.hasClass( 'open' ) ){
        var $openItem = $container.find( '.open' );

        // if any, close currently open items
        if ( $openItem.length ) {
            closeItem( $openItem );
        }

        openItem( $this );
    }
});

and this: $container.on( 'click', '.close', function( event ) { event.stopPropagation(); closeItem( $( this ).closest( '.product' ) ); });

function openItem( $item ) {
    var $image = $item.find( '.product-image' );

    $item.addClass( 'loading' ).spin( spinJsConfiguration );

    $image.attr( 'src', $image.data( 'src-large' ) );

    $item.imagesLoaded( function() {
        $item.spin( false ).removeClass( 'loading' ).addClass( 'open' );
        $container.addClass( 'item-open' ).isotope( 'reLayout' );
        $item.append( '<div class="close">&times;</div>' );
    });
}
function closeItem( $item ) {
    $item.removeClass( 'open' ).find( '.close' ).remove();
    $container.removeClass( 'item-open' ).isotope( 'reLayout' );
}
});

any help would be appreciated

Upvotes: 1

Views: 70

Answers (1)

Huso
Huso

Reputation: 1486

The link doesn't work because of the click handler. Your link is a child of the li .product .

The click handler contains preventDefault(). Removing that would make the link working again.

Edit: Based on your comment, change the following:

$container.on( 'click', '.product', function( event ) {
    var $this = $( this );

To:

$container.on( 'click', '.product-link', function( event ) {
    var $this = $( this ).parent();

And don't remove preventDefault().

Upvotes: 2

Related Questions