[問題] 延格線書寫(類似筆記本)

看板Web_Design作者 (等一個人。)時間12年前 (2012/03/02 21:40), 編輯推噓1(105)
留言6則, 4人參與, 最新討論串1/1
各位版友晚安, 近來網頁設計上遇到困難,想請教各位板友是否有比較好的解決辦法。 網頁上需要的功能類似筆記本的作用,依照背景圖片的格線做文字書寫及換行。 目前的方式是將背景圖片設定為有格線的底圖, 上面再放一個textarea背景作半透明,讓使用者在此輸入。 以調整到可以依照格線換行。 但目前遇到的問題是,如果輸入的文字過多超過預設視窗的大小後, 會出現卷軸,這樣使用者一拉動卷軸,文字就會離開背景格線。 但如果將卷軸隱藏,使用鍵盤移動游標回第一行,又會發生位移半個文字的情況。 不知道有沒有甚麼比較好解決辦法? 麻煩各位板友了,謝謝。 -- ※ 發信站: 批踢踢實業坊(ptt.cc) ◆ From: 114.25.229.38

03/03 00:32, , 1F
背景延伸?
03/03 00:32, 1F

03/03 03:12, , 2F
(胡亂回答)不知道可不可以用svg做到這樣的效果呢。
03/03 03:12, 2F

03/03 12:53, , 3F
background-attachment:fixed; 試試 ;)
03/03 12:53, 3F

03/03 12:53, , 4F
或是每一行用一個 input 只留底線也可以。
03/03 12:53, 4F

03/11 10:16, , 5F
<div class="editbox" contenteditable="true">
03/11 10:16, 5F

03/11 10:16, , 6F
然後背景直接放在這個 editbox 就好
03/11 10:16, 6F
文章代碼(AID): #1FKCsu4q (Web_Design)