(css & js) w大oed排版调整

dfliaoyue · 发表于 2018-4-20 22:22:49

本帖最后由 dfliaoyue 于 2018-5-26 13:14 编辑

词典链接
经典不用多说。
原版排版很干净。所以基本没动配色和整体布局。当然了也确实不太好动。
改了一下，稍微突出释义，另外就是改了自动隐藏的逻辑，加快了加载速度。详细内容：

微调了例句缩进。原设计的例句缩进在手机上莫名有点小(似乎pc和手机的em长度不同?)，微调了一下。
微调了例句、拼写和构词法的字号。突出释义。
默认隐藏拼写和构词法。
例句自动隐藏的条目下限调整到30个例句块(一个分释义下的所有例句只算一个)
修改了自动隐藏的逻辑，现在加载速度应该会快不少，特别是长词条。
- 方法就是css默认设置为隐藏，由js检查是否展开，如果例句够少就一个个改为展开；原逻辑是原本展开，由js检查是否隐藏，如果例句够多就一个个改为隐藏。应该能理解速度差异吧。
- 副作用就是离开js后词典有的项目就看不到了。而原版的没有js时是全部展开的。

Oxford English Dictionary 2nd.zip (17.69 KB, 下载次数: 85)

dfliaoyue · 发表于 2018-4-22 13:56:39

PbutH 发表于 2018-4-22 12:57
感谢分享！
小提示：欧路词典中，要把该词典排在前面(试试前三位)才能显示特效。

抱歉，刚没看清那个罗马数字的问题。那个罗马数字的问题，是因为这是不同的词条合并了，自然会大些。我没去试图定位过，你可以去找内容块，可能是词头下面的内容块的底部距离。
建议不要改太小，毕竟是不同的词条。只不过这个词碰巧词条多又好几个只有单一义项的。

sculiuchang · 发表于 2018-4-21 00:14:42

有点意思，下载了，例句字体小，倒是可以突出释义哈。

PbutH · 发表于 2018-4-22 12:57:21

本帖最后由 PbutH 于 2018-4-22 13:09 编辑

感谢分享！
小提示：欧路词典中，要把该词典排在前面(试试前三位)才能显示特效。

另外，我想缩小罗马序数所在行跟前一行之间的间距(在我手机上感觉太宽了，见图)，但是我不知道怎么去定位“罗马序数”所在的行(找不到)，所以就没法修改top值了，求解……

dfliaoyue · 发表于 2018-4-22 13:49:36

PbutH 发表于 2018-4-22 12:57
感谢分享！
小提示：欧路词典中，要把该词典排在前面(试试前三位)才能显示特效。

不用欧路，不清楚也没动力弄…我只是简单改了下js的逻辑，和原版区别不大，也许原来的就有这问题？之前看到好像是f大还是谁说过这个问题，你去技术区找找和问问吧。
罗马数字的话，你先定位后面的条目，再展开se2/4/6/8。我现在没办法拿电脑看，印象里应该是解释前面，嵌套了几层，一项项展开总能找到。

1147062343 · 发表于 2018-4-24 11:15:12

受用了，谢谢，试一试

[改版] (css & js) w大oed排版调整

评分