技術(shù)資訊
dede標(biāo)題不完整時(shí)加省略號(hào)
2012-07-22 19:01:35
有時(shí)候青島網(wǎng)站制作中,新聞的標(biāo)題需要進(jìn)行字?jǐn)?shù)限制,這就需要加入一個(gè)title屬性,讓鼠標(biāo)放上去的時(shí)候顯示完整標(biāo)題。另外目前的調(diào)用只能同時(shí)調(diào)用一種標(biāo)題方式,不過(guò)可以采用以下方法,進(jìn)行判斷,無(wú)簡(jiǎn)略標(biāo)題顯示完整標(biāo)題。例如dede早期版本中的”有來(lái)源
顯示來(lái)源,無(wú)來(lái)源不顯示”、”有作者顯示作者,無(wú)作者不顯示”。
方法一:
{dede:field name='array' runphp='yes'} if (@me['shorttitle']=='') @me=@me['title'];else @me=@me['shorttitle'];{/dede:field}
方法二:
[field:array runphp='yes'] if (@me['shorttitle']=='') @me=@me['title'];else @me=@me['shorttitle'];[/field:array]
這個(gè)方法可以在{dede:arclist}標(biāo)簽中套用。
方法三:
有時(shí)標(biāo)題過(guò)長(zhǎng),全部顯示會(huì)導(dǎo)致排版混亂,影響美觀。但顯示一部分又影響用戶(hù)體驗(yàn)。我們希望當(dāng)標(biāo)題在一定長(zhǎng)度范圍內(nèi)時(shí),全標(biāo)題顯示,當(dāng)標(biāo)題過(guò)時(shí),只顯示一定長(zhǎng)度,后面加省略號(hào),然后當(dāng)鼠標(biāo)移上去時(shí)再顯示標(biāo)題的全部?jī)?nèi)容,這樣就即做到了不影響版面的布局,又做到了標(biāo)題內(nèi)容的全部顯示。
這里給出不需要修改程序,只修改模板的方法。舉例,下面的標(biāo)題列表,最長(zhǎng)的標(biāo)題50字節(jié),只想顯示30字節(jié),模板代碼如下:
<ul>
{dede:arclist titlelen='50' row='10'}
<li><a title="[field:title /]" href="[field:filename /]">[field:title function='( strlen("@me")>30 ? cn_substr("@me",30)."..." : "@me" )'/]</a></li>
{/dede:arclist}
</ul>
很明顯,解決問(wèn)題的關(guān)鍵在于用 [field:title function='( strlen("@me")>34 ? cn_substr("@me",30)."..." : "@me" ) ' /] 代替了原來(lái)的 [field:title /] ,在輸出標(biāo)題時(shí)多了一個(gè)判斷的過(guò)程,先判斷標(biāo)題是否大于34字節(jié),如果大于則只輸出30字節(jié)的長(zhǎng)度,并加上省略號(hào)。而title="[field:title /]" 則不受影響,鼠標(biāo)移上去時(shí)顯示標(biāo)題的全部?jī)?nèi)容。
方法四:
除上面修改模板的方法外,還有編程或CSS等方法。但能通過(guò)模板解決的問(wèn)題,編程就不必要了。CSS的方法如下:
<a style="width:120px; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;" title="DedeCMS2007即將發(fā)布" href=" " >DedeCMS2007即將發(fā)布</a>
解釋?zhuān)簑idth:120px; 限定長(zhǎng)度,text-overflow:ellipsis :當(dāng)對(duì)象內(nèi)文本溢出時(shí)顯示省略標(biāo)記...,white-space:nowrap:強(qiáng)制文本在一行內(nèi)顯示,overflow:hidden:溢出內(nèi)容為隱藏。
CSS的方法比修改模板還要簡(jiǎn)單,不過(guò)很遺憾,text-overflow:ellipsis屬性在firefox中是沒(méi)有效果的。所以,還是使用上面的修改模板的方法吧。
近期更新
- [2023-07-26 14:17:28] 為品牌賦能,海外官網(wǎng)品牌數(shù)字化
- [2023-05-06 10:32:26] 青島網(wǎng)站建設(shè)公司,高端網(wǎng)站定制,一站式網(wǎng)站服務(wù)——力圖數(shù)字科技
- [2023-04-27 13:47:54] 高端定制網(wǎng)站建設(shè)——從滿(mǎn)足預(yù)期到走向卓越
- [2023-04-11 09:17:49] H5頁(yè)面設(shè)計(jì)開(kāi)發(fā)——移動(dòng)端傳播利器
- [2022-11-16 10:11:43] windows2012程序在哪
- [2022-04-14 11:01:47] 力圖數(shù)字科技配套網(wǎng)站服務(wù)支持
- [2021-05-18 10:14:11] 青島網(wǎng)站建設(shè)的流程
- [2021-04-29 10:14:38] 企業(yè)定制化官網(wǎng)建設(shè)項(xiàng)目
- [2021-03-05 10:34:45] 移動(dòng)互聯(lián)時(shí)代房地產(chǎn)行業(yè)的微信小程序解決方案
- [2021-01-22 17:29:38] 微信小程序有哪些優(yōu)勢(shì)?為什么要開(kāi)發(fā)微信小程序?
- [2021-01-08 17:28:04] 網(wǎng)站建設(shè)最容易忽略的人性化設(shè)計(jì)
- [2020-12-16 16:55:32] 建設(shè)一個(gè)常規(guī)的公司網(wǎng)站建設(shè)成本大概是多少?
延伸閱讀
- [2011-12-07 23:08:37] 青島網(wǎng)站制作中如何合理的布局網(wǎng)站關(guān)鍵詞
- [2014-11-13 22:56:52] 網(wǎng)頁(yè)設(shè)計(jì)師如何跟客戶(hù)溝通
- [2011-10-21 15:02:35] 青島網(wǎng)站設(shè)計(jì)成功要素
- [2012-08-26 17:36:20] 網(wǎng)頁(yè)加載速度研究
- [2015-02-05 09:03:49] 網(wǎng)站重建怎么保護(hù)已有的排名?
- [2015-04-01 23:01:54] 網(wǎng)站的日常黑客防護(hù)與處理辦法
- [2011-10-16 13:41:34] 青島網(wǎng)站制作之SEO標(biāo)題關(guān)鍵詞的深度挖掘
- [2017-01-16 08:45:00] 青島網(wǎng)站建設(shè)的財(cái)富秘籍之高手是怎樣做banner的?
- [2011-12-15 01:24:38] 網(wǎng)頁(yè)設(shè)計(jì)與平面設(shè)計(jì)的差異
- [2013-01-13 22:41:35] 如何拷貝加密pdf內(nèi)容
- [2012-05-31 22:36:49] 如何隱藏表格邊框
- [2014-10-27 11:32:43] 高權(quán)重老站被百度K掉后如何處理
解決方案
輪胎行業(yè)網(wǎng)站設(shè)計(jì)解決方案 機(jī)械行業(yè)網(wǎng)站設(shè)計(jì)解決方案 房地產(chǎn)行業(yè)網(wǎng)站設(shè)計(jì)解決方案 科技企業(yè)網(wǎng)站設(shè)計(jì)解決方案 電子家電網(wǎng)站設(shè)計(jì)解決方案 食品行業(yè)網(wǎng)站設(shè)計(jì)解決方案 集團(tuán)公司網(wǎng)站設(shè)計(jì)解決方案 企事業(yè)單位網(wǎng)站設(shè)計(jì)解決方案 外貿(mào)行業(yè)網(wǎng)站設(shè)計(jì)解決方案 健身運(yùn)動(dòng)網(wǎng)站設(shè)計(jì)解決方案 美容與化妝品網(wǎng)站設(shè)計(jì)解決方案 建筑設(shè)計(jì)行業(yè)網(wǎng)站設(shè)計(jì)解決方案 物流行業(yè)網(wǎng)站設(shè)計(jì)解決方案
TAGS關(guān)鍵字
英文網(wǎng)站建設(shè) 企業(yè)網(wǎng)站為什么要備案 青島網(wǎng)站設(shè)計(jì)哪家好 青島輪胎網(wǎng)站設(shè)計(jì) 企業(yè)網(wǎng)站建設(shè) GOOGLE 青島網(wǎng)站制作 輪胎網(wǎng)站設(shè)計(jì) 蘋(píng)果系統(tǒng) 手機(jī)網(wǎng)站建設(shè) 青島高端網(wǎng)站建設(shè) 青島網(wǎng)站優(yōu)化 中小型企業(yè)網(wǎng)站建設(shè) 青島做網(wǎng)站多少錢(qián) 官網(wǎng)網(wǎng)站建設(shè) H5 HTML5 營(yíng)銷(xiāo)策略 企業(yè)網(wǎng)站 IT資訊 插畫(huà) 視覺(jué)靈感 青島網(wǎng)站建設(shè)公司哪家好 網(wǎng)站設(shè)計(jì) H5定制設(shè)計(jì) robots 頁(yè)面設(shè)計(jì) 平面設(shè)計(jì) 響應(yīng)式設(shè)計(jì) 青島好的網(wǎng)站優(yōu)化公司