對風速有反應的旋轉函數

需要在javascript flash或css中找到函數。這將使我能夠以幾種不同的速度旋轉風車的圖像。這些速度需要根據真實的世界風速改變。對風速有反應的旋轉函數

2012-03-14 tsand

這很有趣。你有什麼問題？ – Hamish 2012-03-14 20:36:06

我的問題是我可以使用什麼格式，並且有沒有辦法將風速和旋轉的速度變量鏈接到另一個應用程序，如谷歌天氣？ – tsand 2012-03-16 15:50:07

您可以使用CSS轉換輕鬆完成此操作。我會給你一些提示，讓你開始。

閱讀this文章。和here is a quick demo爲你（僅webkit）。

通過定義你動畫開始時，把它叫做spin，從0到360度：

@-webkit-keyframes spin { 
    from { -webkit-transform: rotate(0deg); } 
    to { -webkit-transform: rotate(360deg); } 
}

然後，風車圖像上應用的動畫，迭代和定時功能：

.windmill{ 
    -webkit-animation-name: spin;  
    -webkit-animation-iteration-count: infinite; 
    -webkit-animation-timing-function: linear;  
}

然後定義你的速度（你會需要這些基於圖像的大小來計算，和風速公式）：

.windmill.mph-0 { -webkit-animation-duration: 0s; } 
.windmill.mph-10 { -webkit-animation-duration: 10s; } 
.windmill.mph-20 { -webkit-animation-duration: 5s; }

現在可以使用JavaScript應用風速變化：

$('.windmill').addClass('mph-10'); // stats spinning at 10 mph

來源

2012-03-14 20:59:53

這似乎是我需要感謝你。我仍然想知道這是否可以鏈接到另一個應用程序，如谷歌天氣？我想讓風車響應觀衆給定區域內的風速。我是網頁設計和編碼的新手。 – tsand 2012-03-16 16:03:58

對風速有反應的旋轉函數

回答

相關問題