2010-04-22 69 views
0

如何使用html,css和javascript實現http://jdstiles.com/java/angledtext2.html這種角度(傾斜)。在設計中,我們有表格結構體,通過點擊一個標籤頁,下面的區域應該刷新而不用重新加載頁面(有些像jquery或ajax)。通過html css和javascript傾斜設計?

+6

你爲什麼不使用你鏈接的那個? ......我覺得這樣很可怕。 – CiscoIPPhone 2010-04-22 15:29:08

+2

我不認爲他想這樣做的文字,這就是爲什麼我保留判斷...... @Nehal:請告訴我你不想用它的文字... – dclowd9901 2010-04-22 15:32:54

+3

啊,易讀性; **所以**九十年代... – 2010-11-22 13:15:48

回答

0

它看起來像他們這樣做的方式是通過使用三角函數來將文本繪製爲線。它是基於矢量的,因此它們創建一個上升/運行,將單詞分解爲字符,然後遍歷該函數,爲每個字符添加一個跨度,並將其定位爲實物。

目前尚不完全清楚你想如何使用它,但你需要做的是在一定程度上將你的窗體分解成最小的元素,然後對每個元素應用樣式,使用三角函數的基礎計算循環中每個元素的位置。

雖然不知道你到底想做什麼,但是向你展示它在代碼中的樣子是沒有意義的。您鏈接到的網站可能是該流程的最佳示例,即使不完全符合您的要求。

0

你有很多的選擇:

  • 使用this jquery plugin
  • 使用您鏈接的人。
  • 將文本呈現在畫布中 - 有很多關於如何在網頁上浮動的示例。你需要一個非帆布解決方案,如excanvas.js
  • 使用一個較新的瀏覽器特定的屬性手動

使用插件可以讓你去,最快的速度,而且將圍繞旋轉的字母。