[星火应用商店]寻找新的官网管理员
Tofloor
poster avatar
chaodn
deepin
2020-08-09 02:43
Author
本人即将进入初一,因学业为重,现决定暂时放下星火应用商店的一切事务。
需要管理员来管理网站仓库,星火应用商店官网github仓库地址:https://github.com/chaodn/Spark-Store-Website
官网我也做得差不多了,但是需要继续优化官网。可以参考网站概念PPT:
https://chaodn-my.sharepoint.com/:p:/g/personal/chaodn_chaodn_tk/ETCi6KEE79lFgY_TE7iinZ0BcpX3_L9uPBLU_jIOmSk_Qw?e=
如果你没有太多时间,但也想贡献,可以为我们贡献一些代码。



有意者请联系我:
电子邮箱:chaodn@chaodn.tk


招到网站新的管理员后我就可以放心学习,可能就要“失踪”了。
同时欢迎各位朋友积极投递和维护应用,欢迎社区开发者入驻星火开发者联盟。


Reply Favorite View the author
All Replies
2 / 2
To page
avatar
Cris.Q
deepin
2020-08-10 01:06
#21
https://bbs.deepin.org/post/198626
你厉害,你来做吧!

请你去找更厉害的人吧
Reply View the author
avatar
Rubbish
deepin
2020-08-10 01:24
#22
用到了什么技术栈啊,看仓库里好像是纯手写的
Reply View the author
avatar
MeowVing
deepin
2020-08-11 07:57
#23
没事,我先帮你设计着~

Reply View the author
avatar
beautycell
deepin
2020-08-11 15:00
#24
https://bbs.deepin.org/post/198626
要小初衔接,学校给我们布置了一堆作业。

加油,有作业真好
Reply View the author
avatar
lcw0268
deepin
2020-08-11 16:14
#25
呵呵,嘻嘻,坐等吃果子。
本来已路过,回过味来就回来嚎一声:大伙快上。
Reply View the author
avatar
152******80
Advanced Packager
2020-08-11 16:20
#26
初一,现在做软件都是小学开头了?
Reply View the author
avatar
吉王义昊
deepin
2020-08-23 02:49
#27
本帖最后由 jwyh 于 2020-8-22 18:53 编辑

我可以帮忙写一下,现在的官网确实不怎么样。不过开学新高一,也抽不出来太多精力搞这个
顺便提一下,在小屏幕设备下,官网的首图下方有一道白边,而且首图被导航栏遮挡现象明显,刚刚花时间尝试解决了一下,代码已提交PR(提交用的github用户名是jiwangyihao)。

问题图片(末尾那张我也不知道怎么回事,忽略即可):





修改后图片:



主要修改了index.html和firm.js两个文件。(CNAME被修改是因为我要用github page测试,又改回去了)

问题分析及解决方式如下:

1. 白边的出现是因为div#banner设置了一个固定高度898px,而网站实际上是一个自适应网站,不应该出现大块区域固定宽高的情况。二这个固定高度实际上出现在firm.js中初始化轮播图的代码里,这里直接将height属性的值设置为auto;
2. 在浏览器控制台里手动取消div#banner的height样式(或者按照步骤一更改代码)后会发现它的高度没了(为零),这是因为它的子元素加了绝对定位,绝对定位的子元素不能撑起父元素的宽高(而且这个子元素的高度还是百分比,是按照父元素高度的百分比来计算的);
3. 这个时候我们还有多种方案解决问题,比如通过JS代码来计算出div#banner应有的高度(宽度除以16再乘9,因为图片比例是16:9),不过这实在不够优雅(因为直接用JS写死的话一旦浏览器窗口大小改变,高度就又不对了,如果去监听窗口事件的话性能上也是大问题)。如果要用CSS解决这个问题,应该怎么办呢?这个时候就要请出一个特性了,前面说过,子元素的百分比高度是按照父元素的高度计算的,那很多人会想当然的以为子元素的百分比上下内边距也是按照父元素的高度来计算。事实恰恰相反,子元素的百分比上下内边距其实是按照父元素的宽度来计算的。那么我们可以给div#banner加上padding-top:56.25%;的样式(100÷16×9=56.25),就可以把div#banner的高度撑起来了;
4. 这个时候,新的问题又出现了,虽然div#banner的高度有了,但是并没有看到图片,只有一个白色矩形。这是因为div#banner的子元素(因为没有id和class,就叫它div-c好了)其实是相对定位,绝对定位的是div-c的子元素div.layui-this。这两个元素的高度都是100%,但是div-c的父元素的内高度(实际高度-内边距)等于0,所以这两个元素高度都是零。这个时候还有多种解决方案,比如给div-c加绝对定位(这样就可以无视内边距),不过,如你所见,我最后并没有选择这个方案(因为这几个元素实际上是由layui操作的,要考虑日后代码的可靠性和兼容性)。我的方案是,把第三步给div#banner的样式取消,把这个上内边距给div-c,一样可以把高度撑起来;
5. 现在白边问题已经解决了,接下来就是图片被遮挡的问题了,这个问题在小屏幕设备上较为明显,因为图片的高度是随屏幕宽度变化的,而导航栏高度则是固定值,这就导致屏幕越窄,图片被遮挡的部分就越多。解决方式也十分简单,给div-c加上上外边距即可(实际加的外边距70px比导航栏的高度略小,因为适当遮挡一点比较美观)。


Reply View the author
avatar
吉王义昊
deepin
2020-08-23 02:57
#28
https://bbs.deepin.org/post/198626
你厉害,你来做吧!

另外说实话,写的确实不怎么样,尤其是自适应做的非常不好,这方面需要多下功夫。另外套模板然后在慢慢改效率和代码质量都很低,不如用一些技术栈(比如Vue.js),而且双向绑定和组件库可以节省你大量的时间和精力,写出来的页面也容易做到风格统一易于维护
Reply View the author
avatar
beautycell
deepin
2020-08-23 03:17
#29
https://bbs.deepin.org/post/198626
楼主居然还没上初中,让我这些50岁老头子汗颜啊

这个是好事 说明我们的小朋友中有高手
Reply View the author
avatar
pgxppp
deepin
2020-08-23 04:01
#30
支持下,我只懂汇编帮不上啊
Reply View the author
avatar
angelfind
deepin
2020-08-23 14:18
#31
本帖最后由 angelfind 于 2020-8-23 07:00 编辑

优化了一下导航菜单, 幻灯片, footer, 先上传个效果图, 为啥无法插入截图, 显示服务器内部错误.  只能这么搞了, 不知道有没有用.







           
       
   
   
   

    星火应用商店





   





   
   

   

        
            
        

        
        
            beta 7
        

   

   






*src="static/plug/jquery-3.5.1.min.js">
*src="static/plug/bootstrap-4.5.2-dist/js/bootstrap.bundle.min.js">
*src="static/js/u.js">






Reply View the author
avatar
chaodn
deepin
2020-08-23 18:05
#32
https://bbs.deepin.org/post/198626
我可以帮忙写一下,现在的官网确实不怎么样。不过开学新高一,也抽不出来太多精力搞这个
顺便提一下 ...

jiwangyihao 原来是你呀,感谢大佬!
Reply View the author
avatar
吉王义昊
deepin
2020-08-23 18:13
#33
https://bbs.deepin.org/post/198626
jiwangyihao 原来是你呀,感谢大佬!

jwyh就是吉王义昊的拼音(jiwangyihao)的缩写嘛,另外提交比较冗余(改两行代码四个提交),主要是平时不常用github,也是第一次提交PR,没有经验。
Reply View the author
avatar
吉王义昊
deepin
2020-08-23 18:23
#34
https://bbs.deepin.org/post/198626
jiwangyihao 原来是你呀,感谢大佬!

话说我昨天就想问来着,怎么资源地址都是../,刚刚在github一看,改成./了,昨天开github page调了一会都不显示,后来才发现资源地址写错了(不过没有给你改,因为害怕可能是你的服务器特殊之类的必须要这么写)
Reply View the author
avatar
吉王义昊
deepin
2020-08-24 01:36
#35
今天抽时间仔细看了一下网站的代码,做了一些优化,也修正了一些问题,代码已提交PR(github用户名jiwangyihao),清单如下:

1. 调整代码缩进
2. 使用HTML5的footer标签重写footer,大幅精简代码,增强代码的语义化
3. 修正了一些代码错误
4. 修正了首页在窄屏幕设备菜单栏里多余的星火应用商店字样
5. 修改了关于我们介绍的部分措辞及代码
6. 格式化index.css并修改了footer相关样式
7. 修改了关于我们的图标样式
   1. 取消了layui的默认行内样式
   2. 图片宽度设置为24vmin(屏幕短边的24%)
   3. 图片设置左浮动
8. 将关于我们简介部分标签名改为团队简介
9. 修正了菜单栏在屏幕宽度为768px~992px之间的设备上与logo重叠的问题
10. 修正了菜单栏在屏幕宽度为992px~1200px之间的设备上与logo距离过近的问题

预览修改后的效果请访问:https://jiwangyihao.github.io/Spark-Store-Website-CN/
Reply View the author
avatar
chaodn
deepin
2020-08-24 20:05
#36
https://bbs.deepin.org/post/198626
今天抽时间仔细看了一下网站的代码,做了一些优化,也修正了一些问题,代码已提交PR(github用户名jiwangyi ...

请加入我们的网站开发群:1044531138
Reply View the author
Comments
jwyh
2020-08-24 23:10
已发送加群申请
avatar
deepin爱好者
deepin
2020-08-26 06:16
#37
https://bbs.deepin.org/post/198626
要小初衔接,学校给我们布置了一堆作业。

嘿,巧了,我也是跟你一样(xxs)
Reply View the author
2 / 2
To page