15

CSS と jQuery だけを使用して、ホイール オブ フォーチュンを描画したいと考えています。画像は一切使用したくありません。

また、円内に少なくとも8 つのセグメントを配置し、各テキスト ワードを各セグメント内で垂直方向に適切に配置したいと考えています。説明する写真を次に示します。

ここに画像の説明を入力

これが機能したら、CSS3 rotateプロパティを使用できます。

どうすればこれを行うことができますか?

4

4 に答える 4

17

これは、キャンバスを使用して HTML5 で行われた糸車のデモです: LINK ここに画像の説明を入力

プロジェクト デモ ファイルへの直接ダウンロード: ZIP


編集:ここに別のチュートリアル デモがあります:
html5 キャンバスを使用してルーレット ホイールを作成する

于 2012-06-21T08:51:23.773 に答える
6

Canvas を使用した糸車の別の例を次に示します。

回転する JavaScript ホイール

于 2012-11-19T00:39:43.380 に答える
2

このリンクを確認してください - > http://joelb.me/blog/2011/css-mask-tutorial-rotating-image-gallery/

必要に応じて導入チュートリアルが含まれています。JS 2d Transformationライブラリ コードも github で確認してください。

于 2012-06-21T05:02:16.113 に答える
0

Raphael を使用してルーレット盤を作成しました: http://www.guesttime.com/members/ledlogic/roulette/index.html

あなたと同じようにテキストが回転していますが、各文字の中央揃えを処理する必要があります。

于 2013-03-03T17:15:45.357 に答える