簡體   English   中英

單擊時使div動畫,但單擊該div中的元素時不動畫

[英]Animate div when is clicked but not animate when elements inside that div are clicked

我在動畫方面遇到問題,當我單擊div時我想為其設置動畫,但是當我單擊該div中的其他內容時不想對其進行動畫處理。

這是我的測試網站: http : //kni.prz.rzeszow.pl/~plum/portfolio/index.html

Kontakt div是我在尋找的東西,但是當我單擊textareas div時是動畫的。 這就是問題所在。 謝謝。

我網站上的代碼,但這是animate div id =“ kontakt”的片段:

$(function(){
$("#kontakt").click(function(){
    //zabezpieczenie przed animowaniem wielu div'ów na raz
            if ($('div').is(':animated')) {
        return;
    }
            //główna animacja odpowiedzialna za powiększanie i zmniejszanie div'a
    if (kontakt == 0) {
        kontakt = 1;
        $(this).fadeTo(500, 0.33).delay(500).fadeTo(500, 1);
        $(this).animate({
            left: '+=205',
            top: '-=205'
        }, 1000, function(){
            $(this).animate({
                width: 400,
                height: 400,
                left: '-=205'
            }, 1000, function(){
                $.get('kontakt.html', function(data){
                    $('#kontakt').html(data);
                });
            });
        });
    }
    else 
        if (kontakt == 1) {
            kontakt = 0;
            $(this).html('<a href="#">Kontakt</a>');
            $(this).animate({
                left: '+=205',
                width: 195,
                height: 195
            }, 1000, function(){
                $(this).animate({
                    left: '-=205',
                    top: '+=205'
                }, 1000);
            });
        }
});});

那對我沒有幫助:

$(':text, textarea').click(function(e){
e.stopPropagation();
alert('to dziala');
return true;});

您可以稍微更改#kontakt處理程序以檢查事件的目標,如下所示:

$("#kontakt").click(function(e) {
    if(!$(e.target).is('div, a')) return;

使用.is()我們正在檢查是否直接單擊<div><a> (郵件圖標)。 如果以上兩個都不成立,我們就會跳出來,什么也不做:)

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM