拙作一件,还请各位轻拍哈O(∩_∩)O~

2013-08-07 20:00:58 +08:00
 liangliang
一款天气类的Web App (IE慎入:)

地址: http://1.htmldemo.sinaapp.com/demo7/index.php
GitCafe: https://gitcafe.com/liangliang/WeatherReport

前端菜鸟一枚,自己学了几个月的html/css/js,恰好在网上看到一个老外的教程(http://tympanus.net/codrops/2013/01/17/putting-css-clip-to-work-expanding-overlay-effect/),于是琢磨着自个也写了个,每天晚上七点更新天气数据。

小伙伴们给点建议吧~(@^_^@)~
4729 次点击
所在节点    分享创造
60 条回复
wupher
2013-08-07 20:02:26 +08:00
很漂亮!
liangliang
2013-08-07 20:04:31 +08:00
@wupher 谢谢~T^T
liangliang
2013-08-07 20:07:10 +08:00
haiyang416
2013-08-07 20:09:49 +08:00
@liangliang 虽然是仿做的,但是效果还不错。
SAE开发者认证现在不用求了,已经不收租金了。
liangliang
2013-08-07 20:11:20 +08:00
@haiyang416 soga~ thx
Luciush
2013-08-07 20:45:41 +08:00
提些意見吧。
1,太簡單了!!!除了看溫度和天氣之外,沒有其他的功能甚至些許動畫效果來讓用戶停留。
2,天氣預報的icon做得並不是特別簡明易懂,最崩壞的地方是每日的溫度之間間隙實在太小了,看起來讓人有些煩躁。
3,各個城市的顏色搭配原理是什麼?感覺這些方面其實可以更加用心點,或者加些地標圖片之類的?
如果LZ能夠在原型的基礎上繼續改進些細節的話就好了。
liangliang
2013-08-07 20:48:46 +08:00
@Luciush 收到~多谢指导O(∩_∩)O~
qiuai
2013-08-07 21:04:59 +08:00
没有数据库?
rayps
2013-08-07 21:11:03 +08:00
感觉功能上已经没问题了,可以往视觉上搞点创意,例如用jquery加点动画玩玩吧
daoluan
2013-08-07 21:11:59 +08:00
UI 不错。
liangliang
2013-08-07 21:14:00 +08:00
@rayps 哈哈,正有此意T^T
liangliang
2013-08-07 21:14:40 +08:00
@daoluan thx~
liangliang
2013-08-07 21:16:27 +08:00
@qiuai 有,天气数据来自中国气象局,我参考了这里的 http://blog.csdn.net/hello_haozi/article/details/7564223
qiuai
2013-08-07 21:34:21 +08:00
@liangliang CREATE TABLE `weather` (
`cityid` varchar(255) NOT NULL,
`city` varchar(255) NOT NULL,
`temp1` varchar(255) NOT NULL,
`temp2` varchar(255) NOT NULL,
`temp3` varchar(255) NOT NULL,
`temp4` varchar(255) NOT NULL,
`temp5` varchar(255) NOT NULL,
`temp6` varchar(255) NOT NULL,
`img1` varchar(255) NOT NULL,
`img2` varchar(255) NOT NULL,
`img3` varchar(255) NOT NULL,
`img6` varchar(255) NOT NULL,
`img5` varchar(255) NOT NULL,
`img4` varchar(255) NOT NULL
) ENGINE=InnoDB DEFAULT CHARSET=utf8;

INSERT INTO `weather` (`cityid`, `city`, `temp1`, `temp2`, `temp3`, `temp4`, `temp5`, `temp6`, `img1`, `img2`, `img3`, `img6`, `img5`, `img4`) VALUES
('101330101', 'macao', '27℃~33℃', '28℃~33℃', '29℃~34℃', '27℃~33℃', '27℃~32℃', '26℃~30℃', '3', '0', '0', '8', '3', '1'),
('101010100', 'beijing', '23℃~34℃', '24℃~35℃', '24℃~34℃', '24℃~30℃', '23℃~32℃', '23℃~33℃', '3', '0', '0', '4', '1', '4'),
('101020100', 'shanghai', '31℃~40℃', '30℃~39℃', '30℃~38℃', '29℃~37℃', '29℃~37℃', '29℃~37℃', '0', '0', '0', '0', '0', '0'),
('101280101', 'guangzhou', '25℃~34℃', '25℃~34℃', '25℃~35℃', '25℃~33℃', '25℃~33℃', '25℃~33℃', '0', '0', '0', '4', '4', '0'),
('101230201', 'xiamen', '26℃~35℃', '26℃~35℃', '26℃~33℃', '26℃~32℃', '26℃~32℃', '25℃~31℃', '1', '1', '1', '1', '1', '1'),
('101210101', 'hangzhou', '30℃~40℃', '27℃~40℃', '29℃~39℃', '29℃~38℃', '29℃~39℃', '29℃~38℃', '0', '0', '0', '1', '0', '0'),
('101270101', 'chengdu', '21℃~28℃', '22℃~33℃', '23℃~33℃', '24℃~33℃', '24℃~33℃', '23℃~32℃', '8', '1', '1', '3', '3', '3'),
('101280601', 'shenzhen', '27℃~32℃', '27℃~32℃', '27℃~33℃', '27℃~33℃', '27℃~33℃', '26℃~32℃', '1', '3', '1', '3', '3', '3'),
('101250101', 'changsha', '30℃~39℃', '30℃~39℃', '30℃~39℃', '30℃~38℃', '30℃~38℃', '29℃~38℃', '0', '0', '0', '1', '1', '0'),
('101110101', 'xian', '22℃~28℃', '22℃~32℃', '23℃~34℃', '24℃~34℃', '23℃~35℃', '24℃~35℃', '8', '2', '1', '1', '1', '1'),
('101050101', 'haerbin', '22℃~30℃', '21℃~30℃', '20℃~30℃', '20℃~31℃', '22℃~29℃', '22℃~30℃', '4', '1', '0', '1', '4', '0'),
('101320101', 'hongkong', '27℃~33℃', '28℃~32℃', '29℃~33℃', '27℃~33℃', '27℃~32℃', '26℃~29℃', '1', '0', '0', '8', '3', '1'),
('101340102', 'taoyuan', '27℃~36℃', '27℃~36℃', '26℃~36℃', '26℃~36℃', '27℃~36℃', '26℃~36℃', '1', '0', '1', '2', '7', '7');

我自己写了个.

说真的...你的文档写的真烂啊...cityid跟city还对不起来...还debug了一次才正常起来...
liangliang
2013-08-07 21:46:32 +08:00
@qiuai 抱歉,立马改去。。。。
再一次感谢指教~
qiuai
2013-08-07 22:27:15 +08:00
@liangliang 然后你的sql语言忘了写 ; 了
Perry
2013-08-07 22:32:49 +08:00
Responsive手机大小还可以再优化。点开的详细温度的字体太小了
liangliang
2013-08-07 22:38:18 +08:00
@Perry 打算写一个移动版的:)
hustlzp
2013-08-07 22:41:39 +08:00
底部的空隙可以加大一点。
liangliang
2013-08-07 22:44:06 +08:00
@hustlzp thx~

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/78330

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX