Heim > Web-Frontend > H5-Tutorial > Hauptteil

作为一个前端,看到怎样的网页效果,你一定会停下来看看他的源码?

WBOY
Freigeben: 2016-06-07 08:42:25
Original
1410 Leute haben es durchsucht

最近有点着魔,看到有趣的字体和锚点hover效果 一定会打开看看源码。
开始反思,别的前端工程师会被怎样打代码所吸引呢?

回复内容:

嗯,遇到屏蔽不了的广告的时候,我会停下来查看源码,然后默默给它加上
<code class="language-text">display:none;
</code>
Nach dem Login kopieren
涉及webgl和canvas的,因为这两个我基本不会…(逃) 如果页面很复杂,加载又很快,我会先开Devtools看看实际效率如何,内存占用是否平稳,如果很好,再仔细看看代码。 1.看到动画效果的时候,我会看看到底是 JS 还是 transform 。
2.看到弹出的小窗口,或者 Tiptool 的时候。
3.看到非 Flash 的精致的视频播放器的时候。
4.看到非系统字体的时候。
5.看到异步载入的时候我会情不自禁地 F12 - 网络。 一种正好直击感官的布局方式,在那么多固有套路中走出自己风格的布局总是更令人想了解细节的处理 看到之前死命实现的效果在某网站出现时, 会F12看下它的实现方式(混淆代码太难搞!摔)。 别人惹了我的时候就进他网站看他源码找漏洞。 感觉好,直接复制,粘贴

如果是JS源码被压缩,但是又想知道这代码运行路数,可以这样做:
重载浏览器事件,在运行特定事件下放钩子调试 作為一個 UI 設計師路過。

在如下的情況,我會查看其代碼:

  • 實現了特定我認為很消耗性能的效果(例如高斯模糊);
  • 中文字型並非既定的內置字體時候;
  • 令我驚嘆的動畫效果;
  • 這個網頁有 Bug 時候(錯位,動作沒有預期實行);
  • 編寫其對應爬蟲時候;
  • 編寫其對應優化閱讀的 CSS 時候;

想起來再說吧。 酷炫的动画效果 看使用css还是js写的
精美的布局 也会看看人家是怎么布局的.(如果很少的div套嵌那就太棒了.一般table基本不看 =,=)

个人觉得借鉴学习别人的布局框架,也是进步的一方面.
看来我还是个切图仔...
Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage