如何添加一個JavaScript過渡到jQuery擴展文本？

-1

我遇到了一個爲我找到的摺疊文本-jquery插件創建轉換的問題。 Unfortunatley我幾乎沒有理解JavaScript。在底部，我添加了「& &（this）.show（'fast'）;」但它不起作用。希望你能幫助。如何添加一個JavaScript過渡到jQuery擴展文本？

$(document).ready(function() { 
    var maxheight=16; 
    var showText="Weiterlesen"; 
    var hideText="Zusammenklappen"; 

    $('.expand').each(function() { 
    var text = $(this); 
    if (text.height() > maxheight){ 
     text.css({ 'overflow':'hidden','height': maxheight + 'px' }); 

     var link = $('<p class="weiter" id="noselect"><a>' + showText + '</a></p>'); 
     var linkDiv = $('<div></div>'); 
     linkDiv.append(link); 
     $(this).after(linkDiv); 

     link.click(function (event) { 
      event.preventDefault(); 
      if (text.height() > maxheight) { 
       $(this).html('<a>' + showText + '</p>'); 
       text.css('height', maxheight + 'px') 
       &&(this).show('fast'); 
      } else { 
       $(this).html('<a>' + hideText + '</p>'); 
       text.css('height', 'auto') 
       &&(this).show('fast'); 
      } 
     }); 
    }  
    });

}）;

來源

2017-05-23 Benny

請刪除&&。在那裏使用它沒有意義 –

請嘗試更改這個

$(this).html('<a>' + hideText + '</p>'); 
text.css('height', 'auto'); 
$(this).show('fast');

這是通過使用正確的JQuery語法，羯羊它工作與否要看是什麼「這」。

來源

2017-05-23 20:10:07

可悲的是不起作用。我有一個名爲.expand的p標籤，裏面有很多文本。這個標籤沒有樣式。這只是爲了在javascript中識別它。 – Benny

(this).show();

不會工作。這是一個HTML元素，它沒有顯示屬性。你需要jquerys對象屬性。

jQuery(this)//get the jquery object of that html el 
.show();//call the function on that

$只是jQuery的縮寫。所以：

$(this).show();

注意這是鏈接，但你要顯示的文字（至極已經是一個jQuery對象）：

text.show();

關於& &（中和運營商）：

false && alert("nope"); 
true && alert("yes"); 
a() && b(); //b is just called if a() is truthy => can create bugs in your case

Ita not在這裏使用這個操作符是必需/有用的。但是，你可以用逗號，但其共同簡單地用兩個語句...

但是，如果香港專業教育學院得到了你的權利，它不是neccessary到顯示而是增加一個過渡。可以用CSS來實現：

.expand{ 
transition:all 2s ease; 
}

注的高度，這並不工作，但對於最大高度，所以人們可以設置高度：汽車，從0像素最大高度改爲500％...

來源

2017-05-23 20:18:53

感謝您的澄清！不幸的是，CSS風格似乎沒有做任何事情。我能做些什麼來幫助大家理解這個問題嗎？ – Benny

@benny我認爲這是一個高度問題：汽車和轉場。可以看看，我敢打賭，這是另一個線程... –

@bennyvoiláhttps://stackoverflow.com/questions/3508605/how-can-i-transition-height-0-to-height-auto-using- CSS –

如何添加一個JavaScript過渡到jQuery擴展文本？

回答

相關問題