隐藏省略文字特效

2012-09-23　来源/作者：懒人图库　分类：文字特效　 «»

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>隐藏省略文字特效-懒人图库</title>
</head>

<body>

<div id="hutia">这没事就懒洋洋闲逛的我
迎面驶来了28的永久自行车
我脚下的鞋很破了
可是回力这个牌子还是不错
小卖店的电视机里在播
白娘子和许仙在唱歌

千年等一回 我无悔啊

这就是80后简单的生活
你一定不要忘记了
随着时间慢慢的推移
这一切都离我们远去
以前十块钱就能买的东西
现在一定要出动毛主席
现在人们都彼此不相信
在彼此伤害着对方的心
小时候的回忆 已不再清晰

云残风呼啸 岁月催人老
只为这一杯 能不哭也不笑
时间难倒回 无人再陪我来醉
那是我的爱啊 一去不再回

无尽的虚伪 无尽的憔悴
无尽的醉了 无尽的眼泪
我的爱呀 是我的轮回
你的爱呀 换不回
无尽的虚伪 无尽的憔悴
无尽的醉了 无尽的眼泪
我的爱呀 是我的轮回
你的爱呀 换不回

呐……呐……呐……呐……呐……

这没事就懒洋洋闲逛的我
迎面驶来了28的永久自行车
我脚下的鞋很破了
可是回力这个牌子还是不错
小卖店的电视机里在播
白娘子和许仙在唱歌

千年等一回 我无悔啊
千年等一回 我无悔啊

无尽的虚伪 无尽的憔悴
无尽的醉了 无尽的眼泪
我的爱呀 是我的轮回
你的爱呀 换不回

RAP~
挠一挠二挠金桥，
金桥底下裂瓜瓢，
裂什么裂，猪八戒，
猪什么猪，耗子哭，
耗什么耗，儿马尿，
儿什么儿，张家屯，
张什么张，五杆枪，
五什么五，牛屁肚，
牛什么牛，嘎蛋球，
嘎什么嘎，燕燕瓦，
燕什么燕，扯几把蛋，
扯什么扯，孙老戈，
孙什么孙，吕洞宾，
吕什么吕，刷锅底，
刷什么刷，豆腐渣。

不要忘记我们的回忆，不要忘了我们的梦~
不要忘记我们的回忆，不要忘了我们的梦~
不要忘记我们的回忆，不要忘了我们的梦~
</div>
<p>
  <script>
(function(){
  var o = document.getElementById("hutia");
  var s = o.innerHTML;
  var p = document.createElement("span");
  var n = document.createElement("a");
  p.innerHTML = s.substring(0,100);
  n.innerHTML = s.length > 100 ? "...展开" : "";
  n.href = "###";
  n.onclick = function(){
    if (n.innerHTML == "...展开"){
      n.innerHTML = "收起";
      p.innerHTML = s;
    }else{
      n.innerHTML = "...展开";
      p.innerHTML = s.substring(0,100);
    }
  }
  o.innerHTML = "";
  o.appendChild(p);
  o.appendChild(n);
})();
  </script>
  更多代码请访问：<a href="http://www.lanrentuku.com/" target="_blank">懒人图库</a></p>
<p><script type="text/javascript" src="http://d.lanrentuku.com/goto/js-preview-728x90.js"></script></p>
</body>
</html>

运行代码保存代码提示：您可以先修改部分代码再运行，保存代码功能在Firefox下无效。

如果字数超过限定的字符数，那么超过这个字符数后的文字就显示省略号... 然后出现“展开”或省略号，点击之后就出现全部内容，也可以收起。

标签：文字特效