Web端編寫(六) 瀏覽會議檔案

2021-07-01 19:50:09 字數 1502 閱讀 2070

老規矩,上效果圖

這個頁面是最複雜的頁面,但也很簡單。

先上html**

很長,好像很複雜是不是?我也不清楚為什麼,我把js函式寫到js檔案裡面就是用不了,無法開啟pdf文件,只好寫在頁面裡了。核心是renderpage(num)這個函式,是呼叫js庫開啟pdf檔案的,原理我也不懂,我是拿來主義,修改pdf.js例子裡面的helloworld搞出來的。其餘**能看到這個這篇博文的基本都能看懂了,就不多說了。

挑些重要的**講講。

var fileurl = '';這句**是在後台定義乙個全域性變數,這個變數用來指定pdf檔案的路徑。

這裡用來頁面載入js函式,載入pdf檔案的第一頁

這個就是顯示pdf檔案內容的容器啦,div這個不多說了,是限制顯示的範圍的,不加會出現滾動條,加了就會自動適應螢幕了。canvas元素是html5才有的,簡單來說,它就是乙個畫板,用來畫畫的,pdf.js就是把pdf檔案渲染成一張張的,在canvas上面畫出來。

為了canvas好看點,弄個圓角邊框顯得高大上,給它個css玩

the-canvas的樣式

#the-canvas

工具欄巢狀的層必須按這個順序寫,否則後果自負,會亂成一團的,哈哈。需要的圖示自己製作,那個顯示多少頁的js**在renderpage裡面,就是那句「document.getelementbyid("trip").innerhtml = "第" +pagenum+ "頁/共" + pagecount + "頁";」

上後台**

public partial class viewfile : system.web.ui.page

}

很簡單,定義乙個全域性變數meetingfile,獲值後給js,從資料庫中讀取指定id的檔名,補上存放的目錄賦值給meetingfile。

好,樣式表大放送

*******層樣式

#*******

first層樣式

#first

prev層樣式

#prev

next層樣式

#next

last層樣式

#last

tripdiv層樣式

#tripdiv

好,本系列博文基本就到此了,基本滿足領導的要求了,取代印刷紙質檔案,使用平板開會的基本功能已經可以實現了。

至於使用者管理、終端管理,系統優化,等有專案開發經費再說,不要錢的專案開發就這鳥樣了。

感覺俺完全對得起單位那丁點工資了,哈哈。

Web端編寫(五) 會議檔案的列表

到了這一步,就很簡單了,因為很多東西都講過了。老規矩,效果圖上來。繼續,上頁面html filelist層的樣式 filelist filelist ul filelist ul li filelist ul li first child filelist ul li last child firs...

Makefile檔案編寫 六 自動變數

參考 makefile教程 makefile檔案編寫1天入門 關於自動化變數可以理解為由 makefile 自動產生的變數。在模式規則中,規則的目標和依賴的檔名代表了一類的檔案。規則的命令是對所有這一類檔案的描述。我們在 makefile 中描述規則時,依賴檔案和目標檔案是變動的,顯然在命令中不能出...

瀏覽器端js寫csv檔案

假設使用rest方式取到的資料為json格式。原路徑 function json2csv objarray return keys.join objarray format json objarray array typeof objarray object json.parse objarray ...