Linux 软件免费装

OXP Mobile First Toolkit

开发者 oxymaster
更新时间 2026年9月27日 15:50
PHP版本: 7.4 及以上
WordPress版本: 7.1
版权: GPLv2 or later
版权网址: 版权信息

标签

responsive mobile hover overflow sticky

下载

1.0.0

详情介绍:

Your theme is responsive. Your site still has problems on a phone that no responsive grid solves: fixed backgrounds render as a stretched mess, every hover effect you designed is dead because there is no cursor, one stray element makes the page scroll sideways and you cannot find which, full-height sections overflow the screen and jump when the browser bar collapses, Safari zooms in when someone taps a form field, and a decorative background video quietly spends several megabytes of a visitor's data plan. Four more modules add what a phone screen has no room for: a sticky bar that keeps your main buttons within thumb reach, a back-to-top button, a soft fade at the top and bottom of the screen instead of a hard cut, and a visible acknowledgement wherever a finger lands. OXP Mobile First Toolkit is one panel of switches for exactly those. It is not a caching plugin, not a mobile theme, and it does not touch your desktop layout. Every module arrives switched off. Activating the plugin changes nothing about your site until you turn something on, and one button puts everything back the way it came. Nothing is loaded on a desktop. Not the scripts, not the stylesheets. Whether a visitor is on a touch device is a question only the browser can answer, and a page cache would freeze any answer PHP tried to give, so the decision is made in the browser. A desktop visitor gets a few hundred bytes of inline script that stops on its third line and requests nothing. The single exception is the horizontal-overflow report, which is a tool for you rather than a fix for your visitor: it also runs on a desktop, because narrowing a browser window is how anyone actually hunts that bug. Its files are only ever loaded for a logged-in administrator, so a visitor still gets nothing. You pick the vocabulary. One bar at the top of the settings page decides how the whole screen talks: plain, where everything is described by what it does and there is no jargon anywhere; technical, where things are called by their real names and nothing is explained; or hybrid, the plain wording with the technical term in brackets, which is the one to leave on if you would rather pick the words up as you go. It changes the words and nothing else. Your settings do not move and your site does not change. Every module carries a live preview. Click the eye on a module and a simulated phone appears beside the form, with a switch between "without" and "with", and it follows your own settings as you change them: move the dead-zone sliders and the bands in the phone move, pick a colour for the sticky bar and the bar changes, choose a tap effect and tapping inside the phone plays it.

常见问题:

Does this slow my site down?

On a desktop it does nothing at all: no requests are made, apart from the overflow report for a logged-in administrator. On a phone it loads a small runtime plus only the modules you switched on, with no dependencies and no framework. Two of them, the iOS input zoom and the vertical fade, are a few lines of CSS printed straight into the page and load nothing at all.

Will it change how my site looks on desktop?

No. Every module that changes how a page renders is gated behind (hover: none) and (pointer: coarse), in the script that decides what to load and again in the CSS. The overflow report is the one thing that also appears on a desktop, and only for a logged-in administrator: it draws a panel over your own page and changes nothing about the page itself.

I already use OXP Mobile Fixed Background.

Keep it. The toolkit detects it and stands down from that one module, so the two never fight. Deactivate it if you would rather manage fixed backgrounds from the toolkit instead.

The hover module is activating far too many things.

That is its default: with nothing configured it activates every element on the page that has a hover effect, because the alternative is a module that does nothing until you write a CSS selector. "Only these elements" is how you narrow it: give it a selector such as .card, .tile and the automatic detection switches off entirely, so only what you named is touched.

The hover module does not activate one of my effects.

Almost certainly the effect is defined in a stylesheet served from another domain, such as a CDN. Browsers refuse to let any script read the rules of a cross-origin stylesheet, so the plugin cannot find that rule to mirror it. Serving the stylesheet from your own domain fixes it.

Does the overflow report show to my visitors?

No. It is rendered only for logged-in users who can manage options.

The overflow report used to list something and now it does not.

It now ignores any element whose overflow a container already clips or scrolls, because that element cannot make the page drag sideways and listing it was listing a solved problem. If you dismissed it instead, the panel says how many are hidden and offers to show them again; dismissals are remembered per page, in your own browser.

Does the vibration work on iPhone?

No, and it cannot. No browser on iOS has ever implemented the Vibration API, Chrome and Firefox for iPhone included, since both are Safari underneath. It works on Android in Chrome, Firefox and Samsung Internet. That is why it is off by default and labelled.

The settings screen uses a word I do not know.

Then it is set to the wrong voice for you. At the top of the page there is a bar with three choices: plain, hybrid and technical. Plain never uses a technical term at all. It only changes the words on that screen, so switching between them is free and changes nothing about your site.

I typed a description into "Only these elements" and nothing happened.

That box wants a CSS selector, which is the name a designer gave the element and usually starts with a dot, like .card. A description of the element, however accurate, matches nothing. The plugin now says so when you save something that does not look like a selector. If you do not know the name, leave the box empty: the module finds the elements on its own, which is what it is designed to do.

Can the sticky bar be kept off the checkout?

Not at the moment: it shows on every page. It is worth checking either way, because a fixed bar sitting on top of a Place order button is the most expensive thing this module can do. If the bar is in the way on one page, leave the module switched off on that site until you are sure it is not.

更新日志:

1.0.0 First public release.