How to solve the problem that iframe is not supported on ios?-HTML Tutorial-php.cn

Home

Web Front-end

HTML Tutorial

How to solve the problem that iframe is not supported on ios?

零下一度

Jul 20, 2017 pm 01:27 PM

iframe not support solution

There are many weird problems with iframes, and many Android phones are not normal.
It is not recommended to use iframe on the app.
Double webview is safer, that is, load the page you originally placed in the iframe into a webview and append it to the main page

The specific performance is that when the height of the nested subpage is greater than the parent page The height of the page, and a pop-up event is triggered in the sub-page. At this time, if the height of the sub-page is much greater than the height of the parent page, there will be a situation where the pop-up cannot be found. In fact, it may be below the viewport. The position is only positioned relative to the subpage, not relative to the viewport. I tried many methods, but none were ideal, and the Android system performed well, so I thought that the iOS system can directly jump to the page, while the Android system uses iframe normally (if the Android system directly jumps the page, there will be problems, That is, when the physical return key is pressed, the content of the previous form submission page cannot be cleared normally, and if multiple forms are nested, the corresponding fields will be confused, so use iframe). Look at the code directly:

<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0"><title>网上申请</title></head><body><script src="js/zepto.min.js?1.1.11"></script><script>$(function() {var originId = sessionStorage.setItem('originId', '3'); //originId为后台需要判断是哪个入口的值var u = navigator.userAgent;var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端if (isAndroid) {//安卓终端使用iframevar winH = $(window).height();var iframe = document.createElement('iframe');
            iframe.src = "index_common.html";
            iframe.style.width = '100%';
            iframe.style.height = winH + 'px';
            iframe.style.border = '0 none';
            iframe.setAttribute('scrolling', 'auto');
            document.body.appendChild(iframe);
        } else if (isiOS) {//iOS终端直接页面跳转            location.href = 'index_common.html';
        } else {
            location.href = 'index_common.html';
        }
    })</script></body></html>

Copy after login

I have been working on it for a long time and recorded my growth. If you have friends who encounter similar problems, you can take a look. I also hope to see areas that can be improved. Please give me some advice.

The above is the detailed content of How to solve the problem that iframe is not supported on ios?. For more information, please follow other related articles on the PHP Chinese website!

Statement of this Website

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn

Hot AI Tools

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress images for free

Clothoff.io

AI clothes remover

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Article

Assassin's Creed Shadows: Seashell Riddle Solution

3 weeks ago By DDD

What's New in Windows 11 KB5054979 & How to Fix Update Issues

2 weeks ago By DDD

Assassin's Creed Shadows - How To Find The Blacksmith And Unlock Weapon And Armour Customisation

1 months ago By DDD

Where to find the Crane Control Keycard in Atomfall

3 weeks ago By DDD

Roblox: Dead Rails - How To Complete Every Challenge

3 weeks ago By DDD

Hot Tools

Notepad++7.3.1

Easy-to-use and free code editor

SublimeText3 Chinese version

Chinese version, very easy to use

Zend Studio 13.0.1

Powerful PHP integrated development environment

Dreamweaver CS6

Visual web development tools

SublimeText3 Mac version

God-level code editing software (SublimeText3)

Hot Topics

Where is the login entrance for gmail email?

7648

CakePHP Tutorial

1392

What is the format of the account name of steam

win11 activation key permanent

nyt mini crossword answers

110

Related knowledge

Solution for Win11 unable to install Chinese language pack Mar 09, 2024 am 09:15 AM

Win11 is the latest operating system launched by Microsoft. Compared with previous versions, Win11 has greatly improved the interface design and user experience. However, some users reported that they encountered the problem of being unable to install the Chinese language pack after installing Win11, which caused trouble for them to use Chinese in the system. This article will provide some solutions to the problem that Win11 cannot install the Chinese language pack to help users use Chinese smoothly. First, we need to understand why the Chinese language pack cannot be installed. Generally speaking, Win11

Reasons and solutions for scipy library installation failure Feb 22, 2024 pm 06:27 PM

Reasons and solutions for scipy library installation failure, specific code examples are required When performing scientific calculations in Python, scipy is a very commonly used library, which provides many functions for numerical calculations, optimization, statistics, and signal processing. However, when installing the scipy library, sometimes you encounter some problems, causing the installation to fail. This article will explore the main reasons why scipy library installation fails and provide corresponding solutions. Installation of dependent packages failed. The scipy library depends on some other Python libraries, such as nu.

Oracle NVL function common problems and solutions Mar 10, 2024 am 08:42 AM

Common problems and solutions for OracleNVL function Oracle database is a widely used relational database system, and it is often necessary to deal with null values during data processing. In order to deal with the problems caused by null values, Oracle provides the NVL function to handle null values. This article will introduce common problems and solutions of NVL functions, and provide specific code examples. Question 1: Improper usage of NVL function. The basic syntax of NVL function is: NVL(expr1,default_value).

An effective solution to solve the problem of garbled characters caused by Oracle character set modification Mar 03, 2024 am 09:57 AM

Title: An effective solution to solve the problem of garbled characters caused by Oracle character set modification. In Oracle database, when the character set is modified, the problem of garbled characters often occurs due to the presence of incompatible characters in the data. In order to solve this problem, we need to adopt some effective solutions. This article will introduce some specific solutions and code examples to solve the problem of garbled characters caused by Oracle character set modification. 1. Export data and reset the character set. First, we can export the data in the database by using the expdp command.

Implementing Machine Learning Algorithms in C++: Common Challenges and Solutions Jun 03, 2024 pm 01:25 PM

Common challenges faced by machine learning algorithms in C++ include memory management, multi-threading, performance optimization, and maintainability. Solutions include using smart pointers, modern threading libraries, SIMD instructions and third-party libraries, as well as following coding style guidelines and using automation tools. Practical cases show how to use the Eigen library to implement linear regression algorithms, effectively manage memory and use high-performance matrix operations.

Revealing the method to solve PyCharm key failure Feb 23, 2024 pm 10:51 PM

PyCharm is a powerful Python integrated development environment that is widely loved by developers. However, sometimes we may encounter key invalidation problems when using PyCharm, resulting in the inability to use the software normally. This article will reveal the solution to PyCharm key failure and provide specific code examples to help readers quickly solve this problem. Before we start solving the problem, we first need to understand why the key is invalid. PyCharm key failure is usually due to network problems or the software itself

Resolve Unable to start application properly error code 0xc000007b Feb 20, 2024 pm 01:24 PM

How to solve the problem of unable to start normally 0xc000007b When using the computer, we sometimes encounter various error codes, one of the most common is 0xc000007b. When we try to run some applications or games, this error code suddenly appears and prevents us from starting it properly. So, how should we solve this problem? First, we need to understand the meaning of error code 0xc000007b. This error code usually indicates that one or more critical system files or library files are missing, corrupted, or incorrect.

Common causes and solutions for Chinese garbled characters in MySQL installation Mar 02, 2024 am 09:00 AM

Common reasons and solutions for Chinese garbled characters in MySQL installation MySQL is a commonly used relational database management system, but you may encounter the problem of Chinese garbled characters during use, which brings trouble to developers and system administrators. The problem of Chinese garbled characters is mainly caused by incorrect character set settings, inconsistent character sets between the database server and the client, etc. This article will introduce in detail the common causes and solutions of Chinese garbled characters in MySQL installation to help everyone better solve this problem. 1. Common reasons: character set setting

See all articles