iT邦幫忙

鐵人檔案

2022 iThome 鐵人賽
回列表
Modern Web

30天數學老師作互動式教學網頁 系列

介紹數學動態函式庫JSXGraph.js、Mathjax.js函式庫的使用,並搭配Html5、Css3和Javascript製作互動式數學教學網頁。

鐵人鍊成 | 共 30 篇文章 | 15 人訂閱 訂閱系列文 RSS系列文
DAY 1

數學老師學做互動式教學網頁

由於從事數學教學工作,原本對網頁程式語言就有興趣,前端三大元素HTML、CSS、Javascript也略有涉獵、這幾年積極投入網頁設計的學習,更是發現了現代瀏覽...

2022-09-05 ‧ 由 olddunk 分享
DAY 2

Javascript偷吃步

jsxgraph.js是javascript的一個動態幾何函式庫,因此操作JSXGraph之前,必須對javascript這個程式語言有基本的了解。如果您已經非...

2022-09-06 ‧ 由 olddunk 分享
DAY 3

JSXGraph起手式

今天,廢話就不多話,直接寫code。 網頁程式主要包括HTML、Javascript, CSS三個部分,今天我們只會用到一點點的HTML,大部分會處理Javas...

2022-09-07 ‧ 由 olddunk 分享
DAY 4

從點開始,連成線…

手牽手 一步兩步三步四步 望著天看星星 一顆兩顆三顆四顆 連成線           周杰倫星晴歌詞中出現的點和線是最基本的幾何元素,進而可以創造更複雜的幾...

2022-09-08 ‧ 由 olddunk 分享
DAY 5

尺規作圖和建構

尺規作圖只能用一隻無尺度的直尺(用來畫通過兩點的線)和一隻圓規(用來畫圓和量取等長的線段),如此便可建立歐氏幾何的世界。 畫圓 已知圓心和圓上一點 已知圓心和...

2022-09-09 ‧ 由 olddunk 分享
DAY 6

Euler線和Button元素

今天介紹一個重要的數學定理-尤拉線,透過JSXGraph,我們很容易可以觀察定理的成立。這也是我們第一個教學網頁範例的內容。 利用前面所學建構幾何元素的方法,我...

2022-09-10 ‧ 由 olddunk 分享
DAY 7

建構HTML的按鈕容器

雖然在JSXGraph中可以輕易建立button、chebox、label…等元件,但是這些元件會在畫板內,因此排版並不方便,也會干擾幾何元素的呈現。今天我們將...

2022-09-11 ‧ 由 olddunk 分享
DAY 8

CSS基本觀念

「佛要金裝,人要衣裝,HTML要CSS」。 建置一個網頁和蓋一棟建築一樣,建築架構完成後,要進行內部裝潢;而HTML代表網頁的架構,而CSS則是裝潢師。 CSS...

2022-09-12 ‧ 由 olddunk 分享
DAY 9

CSS的排版利器-Flexbox

昨天的程式碼已經用到了不少Flex來進行排版或是進行盒子上下及左右置中的工作,事實上,只要做網頁,很難避開Flex這個工具。 利用margin來排定元素之間的相...

2022-09-13 ‧ 由 olddunk 分享
DAY 10

用MathJax寫方程式

一般像數學、物理和化學等專業人士,使用簡報或文書處理軟體的時候,都會搭配專業的科學符號字型軟體。一般最常字的就是Mathtype,如果網頁要代替簡報軟體,除了提...

2022-09-14 ‧ 由 olddunk 分享