default
menu home
Icon library Sign up Login favorite_border message help_outline

- Online notes-page3

styleTags:  All CSS html javascript php/other IT
Demo subject javascript捕获缺省的组合快捷键,比如CTRL+F

有时候我们需要在网页上捕获用户的按键动作,然后避免执行缺省动作,替换成我们想要执行的程序。

下面我们以拦截并接管“ctrl+f”组合键为例,代码如下:

by: fanshome  visibility 697
2023-06-09 06:22 (UTC)

subject 把favinavi网络收藏夹的书签搜索功能做到最好

在此先感谢“changanluan”用户的建议,是他(她)提出了这个问题,favinavi怎么还没有书签搜索功能呢?

是啊,我不属于那种要收藏几千个书签的收藏爱好者,所以平常自己并不是特别有搜索书签的需求。但是我不需要不代表没有人需要,favinavi的典型粉丝几乎都是拥有大量书签搜藏的人,所以,这个搜索书签的功能必须有,不然,怎么在几千个书签中快速锁定一个不那么常用的书签到底在哪里呢?

说干就干,先喝杯咖啡,想清楚要怎么做。

目标:要方便、要准确、要醒目、要尽可能自动化。

目标细化下来,决定借鉴浏览器自身的ctrl+F页面搜索功能,这样用户习惯程度最好,培训成本几乎为零。
然后给自己提要求,一定要做到自己能力范围内的极致,最大程度满足用户的想法。

当天熬到凌晨4点,终于把书签搜索功能第一版给做出来了。假如我自己打分的话,至少给自己8分,哈哈!

其中考虑了与书签搜索相关得不少细节:
1、用户键入可能有停顿,所以稍微延迟几百毫秒再进行搜索,避免做无用功,还打扰到用户视觉;
2、搜索结果不仅要醒目,并且主动猜测用户的需要,假如只有一个结果,就直接自动滚动页面到搜索目标,并高亮提示,省得用户动手;
3、如果有多个结果,突出全部匹配的书签,高亮聚焦到第一个,并且同时提供上下选择;
4、上线按钮选择也同样提供自动滚动,永远自动聚焦在当前的匹配书签上;
5、在favinavi网络收藏夹自己的主页面取代浏览器的ctrl+f快捷键功能,直接敲这个组合键可以快速调出favinavi的书签搜索功能。

第一版基本上就是这样,我想满足用户的一般性书签搜索的需求没有啥大问题了吧?

假如还有什么意见和建议,欢迎到留言板写下您的宝贵意见。

by: fanshome  visibility 667
2023-06-10 04:34 (UTC)

subject An example of increasing productivity with the Favinavi web favorites sharing feature

Favinavi’s humanized network favorites provides a sharing function, that is, users can share their favorite and organized bookmarks with their classmates, colleagues or friends.

A leader who works in a local government department (let's call him "Director Zhang" for convenience), works for the quality management and supervision department of the local government. In order to ensure the legal compliance of their work, their departments need to frequently check the laws, regulations, and systems related to their profession. This content is distributed across different types of websites, including national, provincial, prefectural, municipal, and others. And the specific content of these regulations will continue to change over time, and if you do not follow up immediately, it may cause mistakes in work.

So the enthusiastic and willing to use his brains "Director Zhang" thought that if he built a web page, the commonly used legal websites and other commonly used website bookmarks in the work were brought together, and he was responsible for updating, editing, and combing, so that all colleagues in his government department, as long as they had the need to query relevant content, could directly visit this web page and quickly query the latest, most comprehensive and authoritative content.

However, building a website/page that everyone can access may not be easy or necessary. "Director Zhang" thought of his commonly used favinavi network favorites, which can be used to solve his work needs. So he specially registered a new Favinavi account to collect, categorize, organize relevant URL bookmarks, and then published the work-specific favorite sharing URL he created to hundreds of his colleagues. As a result, a set of dynamic 'laws and regulations' that can be adjusted at any time has been created, and colleagues can visit this sharing website at any time if they need to work, which greatly improves work efficiency. If necessary, colleagues can also use the 'one-click to my favorites' feature to add a bookmark directly to their Favinavi favorites for future access.

In addition to sharing your favorite bookmarks as a whole, favinavi can also choose some bookmarks at will to generate a special sharing set, which is more flexible and convenient.

If you have similar needs, consider using https://favinavi.com.

by: demo  visibility 745
2023-06-13 17:36 (UTC)

subject Comparing the mobile adaptability of several Chinese web favorites

In the era of mobile phones, a website is still good to use, and whether you can get a good browsing experience on mobile phones is very critical.

In recent days, I have focused on the screen adaptation of my Favinavi website page, optimizing very, very much detail. Now that the optimization of screen adaptation has come to an end for the time being, I feel that I have done a good job, and then I tested it all with a few terminals (including PC/pad/mobile phone), well... The conclusion is really good, it can be said that it has achieved "humanization".

A little time, out of curiosity, I also want to see how other people do with this aspect of online favorites, hehe.

I won't mention the specific website name, in short, in addition to a relatively professional team to do a special focus on UI favorite websites, most of them can be said to be miserable, basically did not consider the automatic adaptation of the mobile phone, or it is more troublesome, need to download the app. It's really a little unexpected, I don't know if it's the era of mobile phones now?

After a slight turn, I felt very relieved in comparison. I have worked so hard to make the favinavi, of course, I dare not say that I have done the best, but I found that it is actually very unique. I believe that doing your own actual needs as the universal needs of users, although not a very market-oriented good method, is in line with the scientific outlook on development.

Personally make a summary to cheer myself up: compared with the seven or eight Chinese network favorites in the rough test, in terms of mobile terminal interface friendliness, if Favinavi claims to be the second, will anyone dare to claim the first?

by: fanshome  visibility 619
2023-06-14 02:56 (UTC)

subject What should the best web favorites look like?

What should the best web favorites look like? Let's clarify the premise of the discussion here, see: What is a web favorites/online bookmarking.

I am afraid that everyone's answer to this question is different. But in the understanding of favinavi, in addition to the basic functions of general network favorites (such as adding, editing, deleting, importing, exporting), it is to see the convenience of use.

What is convenience? The ultimate convenience is called convenience. What are web favorites used for? Of course, it is used to surf the Internet, translated into the vernacular, that is, you can use the fastest speed to access your favorite website.

How fast can it be fastest? Favinavi's understanding is just one click! One click in the true sense of the word.

Some people will say, this is nonsense! Which bookmark link is not a one-click jumper?

That's right, but I mean: after opening the browser (this time the click is not counted, because everyone uses a browser or browser-like software, so it is not counted), just one click. Specifically, if a certain prerequisite is met, the browser is opened, and the favorite website can be immediately accessed with another click.

It sounds like nothing, let me give you another example: the browser's own bookmarks bar, in the case of chrome, even if you have the Show bookmarks bar turned on in your settings, in general, you need at least 2 clicks to access specific bookmarks. Even if some browsers can directly display bookmarks below the address bar, have you ever thought about it, assuming that there are more bookmarks in favorites? For example, 50, it is impossible to display in one line, if multiple lines are displayed, and it takes up too much of the browser's own screen space, the space used by the browser to display the real web page content is crowded.

One or two clicks worse seems to be nothing, but for heavy Internet users, it seems that most people are still lazy, always hoping to do everything as convenient as possible, the faster the better.

This need for extreme laziness in human nature is the focus of Favinavi's attention. If the user sets the https://favinavi.com as the browser launch page, then you can truly achieve "one-click to fly", because the home page of favinavi is the user's favorites, open the browser, favinavi will try to display the user's favorites directly as much as possible, and the number of bookmarks displayed is pursued as much as possible, the more the better, and at the same time automatically count and display the most frequently visited bookmarks by users. In this way, basically, frequently visited websites are "one hit away", and even scrolling pages are basically not used.

The difference is not very important for light browser users. However, favinavi is mainly intended for those heavy Internet users, for those Internet users who have at least dozens of bookmarks in their favorites, and for lazy cancer patients who want to be lazy in everything.
[img]

Intuitive display, the more the merrier, one-click direct, is the characteristic of Favinavi.

Are you impressed? Register Favinavi right now to feel it

by: demo  visibility 588
2023-06-12 10:15 (UTC)

subject 最好用的网络收藏夹应该是什么样?

最好用的网络收藏夹应该是什么样?我们这里先明确一下讨论的前提,参考:什么是网络收藏夹/网络书签。

这个问题恐怕每个人的答案都不尽相同。但是以favinavi的理解,除了一般网络收藏夹的基本功能(比如添加、编辑、删除、导入、导出)书签外,就是看使用起来的方便性。

什么叫方便?最极致的方便才叫方便,会让人用着用着就上瘾的方便才叫方便。网络收藏夹是用来干什么的?当然是用来上网的,翻译成大白话,就是可以用最快的速度,访问到你收藏的网址。

最快可以有多快?favinavi的理解,就是一次点击!真正意义上的一次点击。

有人会说,这不是废话嘛!哪个书签链接不是一次点击就可以跳转访问的呢?

没错,但是,我指的是:打开浏览器之后(打开浏览器的这次不算哦,因为上网总是要用浏览器或者类似浏览器的软件的么,所以不计入),就一次点击。具体而言,在满足一定前提条件的情景下,打开了浏览器,就真正再用一次点击就可以立即访问到收藏的网站。

听起来好像没有什么,我再举个例子:比如浏览器自己的书签栏,以chrome为例,即便你设置中打开了显示书签栏,一般而言,想访问到具体的书签,还需要至少2次点击。即便部分浏览器可以直接把书签显示在地址栏下方,但是大家想过没有,假设收藏的书签比较多呢?例如50个,甚或500个以上,就不可能一行显示完毕,假如显示多行,又太占用浏览器的自用屏幕空间,浏览器用来显示真正网页内容的空间就被挤占了。

差一、两次点击好像没什么,但是对于重度网络用户来说,好像大部分人还是比较懒的吧,总希望干什么事都越方便越好,越快速越好。

这种人性中极致懒惰的需求,就是favinavi关注的重点。如果用户把https://favinavi.com 设置成了浏览器启动页,那么就可以真正意义上实现“一键起飞”,因为favinavi的首页就是用户的收藏夹,打开浏览器,favinavi就尽可能把用户收藏夹内容直接展示,并且显示的书签数量上追求尽可能多,多多益善,同时自动统计并展示用户最常访问的书签。这样,基本上,常去访问的网站就实现了“一击即达”,甚至连滚动页面都基本不用。

其中的差别,对于轻度浏览器使用者来说,不是很重要。但是,favinavi主要是想给那些重度网络使用者用的,是给那些收藏夹里至少有大几十个书签的网络使用者用的,是给那些凡事都想偷懒的懒癌患者使用的。
[img]
直观展现,多多益善,一键直达,追求最极致的用户体验,就是favinavi的特色。心动了没有?马上注册favinavi开始享受吧!
还没决定?那么就先登录demo演示账户感受一下吧。

by: fanshome  visibility 903
2023-06-23 01:51 (UTC)

subject 对比一下几个中文网络收藏夹的实用性之手机适配篇

手机满天下的时代,一个网站还好不好用,能否在手机上得到良好浏览体验非常关键了。

最近几天自己重点关注了一下自己的favinavi网站页面的屏幕自适应效果,优化了非常非常多的细节。现在屏幕自适应的优化工作暂时告一段落,感觉自己做得很好了,然后就用手头几个终端(包括pc/pad/手机)全部测试了一下,嗯...结论是真的很不错了,可以说是做到了“人性化”。

有点时间,出于好奇心,就同样想看看别人做的网络收藏夹这方面干的怎么样,呵呵。

具体网站名称啥的我就不提了,总之除了一个相对专业的团队做的一个特别注重UI的收藏夹网站,绝大部分可以说是惨不忍睹,基本没有考虑手机自动适配,要不就是比较麻烦,需要下载app。真是有点意想不到,不知道现在已经是手机时代了吗?

稍微转了一圈,对比下来,感觉非常欣慰。自己费了这么多心血做的favinavi,当然不敢说已经做到最好,但发现其实原来还是非常有独到之处的啊。我相信,把自己的实际需求当成是用户的普遍需求来做,虽然不是一个非常市场化的好办法,但却是符合科学发展观的做法。

个人做个小结给自己打打气:就粗略测试的七八个中文网络收藏夹来比,在移动终端界面友好度方面,favinavi人性化网络收藏夹自称第二的话,会不会有人敢号称第一呢?

by: fanshome  visibility 699
2023-06-10 06:08 (UTC)

subject 关于网页上的复选框checkbox的checked和value的问题

这个问题相信很多像我一样的非专业开发者遇到过,就是感觉checkbox是一个神奇的存在,为什么这么说?就是在开发网页过程中,有时候使用checkbox一切顺利,提交表单的时候用JavaScript检查它的checked或value的状态或取值都一切正常;但是又有些时候,无论在JavaScript中怎么折腾,感觉这个checkbox一点儿不听话,明明已经选中了,checked的状态始终不变,真是头疼。

当然,上网学习过,MDN的标准答案是:

如果一个复选框在其表单被提交时没有被选中,就不会有任何代表其未被选中的状态(例如 value=unchecked)的值被提交给服务器——该值根本就没有被提交给服务器!如果你想在复选框未被选中时提交一个默认值,你可以在表单中加入一个具有相同的 name 和 value 的 <input type="hidden"> 字段,它可以由 JavaScript 生成。

checked:
一个布尔属性,表示该复选框是否被默认选中(当页面加载时)。它不表示这个复选框当前是否被选中:如果复选框的状态被改变,这个内容属性不反映这个变化。此时,只有 HTMLInputElement 的 IDL 属性 checked 会更新。

怎么样?是不是好像弄懂了一点东西,但是好像又不是特别明白的样子。假如一个复选框的状态被改变,checked属性不反映这个变化!这时什么意思?如果不变化,那么为什么有些页面它表现又那么正常呢?

经过认真学习思考,我终于得到了我自己的结论,可以翻译成大白话,是个程序员都能明白:

就是复选框在form表单中提交的时候,它会很正常!!!划重点,在“表单中提交时”,一个字也不能少!!!其实MDN的解释里有说,只是没有太过强调罢了。再翻译一下,先假设有这么个场景:

如果为了方便用户,比如在用户设置某些选项时,希望把复选框当成一个开关来用,选中表示“开”,不选中表示“关”,直接根据复选框状态后台就更新数据库里的状态,而不需要用户有提交表单的动作。假如你此时 没.有. 在页面中制作一个表单,只是 单.独. 一个复选框,然后希望用JavaScript来处理后续,那么你就惨了,你会发现无论你怎么折腾,貌似都不能得到当前复选框的“checked”状态,挠头吧?!

其实,这是对的,因为复选框本来就是这个德行,没有表单的提交动作,checked状态是不会跟着用户的鼠标点击勾选而变化的,你只是在页面上看到了框里多了一个勾或变成了一个空的框框,就只是“看到”而已。

那么,假如想在页面上实现前述功能,想让复选框像个开关一样直接起作用的话怎么做?

答案也很简单,如果不想麻烦而使用表单来实现,就扔掉checkbox,换言之就可以只是把checkbox当一个摆设,只是给用户的眼睛看状态,就好了呀!真正用JavaScript处理的东西可以是和checkbox一点关系都没有的,比如我们可以在JS里设一个变量来记录,或者给页面上某个dom元素添加一个属性来记录我们需要的状态,比如:<div id='switch' status='0'></div>,用户点一下checkbox,我们就把“status”值在“0“和”1“之间做个变化,不要去读checked是true or false,直接读写switch元素的status属性值就好。

好吧,也许我的理解并不完全正确,但是以我目前的三脚猫水平而言,事实好像就是如此。

by: fanshome  visibility 1208
2023-06-03 16:45 (UTC)

subject php判断浏览器是否支持avif格式图片的一种方法

最新一代图片压缩格式avif非常好,图片缩小体积效果十分明显,各大公司的新版浏览器已经纷纷支持。

可是,可是!微软的edge到目前为止(2023-06)还没有支持avif,只支持webp,那么怎么办呢?

直接判断浏览器是否是edge并不可取,因为不支持avif的浏览器不止它一种,比较科学而省事的做法是判断浏览器请求头里的accept是否接受avif.

下面以php为例:

by: fanshome  visibility 1235
2023-06-10 12:35 (UTC)