Two usages of iFrame tags in HTML

Two usages of iFrame tags in HTML

I have been working on a project recently - Budou Collection. In short, it is to collect the pictures you like to the Budou page. Many aspects of iframe are used in this process, which can be summarized as follows:
1. As a pop-up layer to cover the bottom

If you have ever made a black mask covering the entire page, and the user happens to be using IE6, and there happens to be a select element on the page, then you will have a headache (I won’t go into the principles here). We will find that the pop-up DIV cannot cover the select, so it is our iframe's turn to appear. The logic is as follows:

Put an iframe at the same level as the pop-up div
Ensure that the z-index of the iframe is smaller than the z-index of the pop-up div
Add window resize and scroll events to ensure that the iframe can cover the entire page

Part of the code

XML/HTML CodeCopy content to clipboard
  1. var iframe = U .isie6() ? ' < iframe   style = "position:absolute;left:0;top:0;z-index:2000000;filter:Alpha(opacity=0); width:100%;height:' + ds.height + '"   frameborder = "0" > </ iframe > ' : '';
  2. $container.append(iframe).appendTo($body);

2. Writing cookies across domains

There are two domains, a.com and b.com. Under certain conditions, some of the functions of b will appear on page a. Sometimes when operating page a, you need to do some operations on the cookies of domain b.com to facilitate the user's next visit. We only need to add an iframe (dynamic or fixed) to page a, with the src attribute pointing to a proxy page of b, and perform cookie operations on this page.

<<:  How to write transparent CSS for images using filters

>>:  Detailed steps to install nginx on Apple M1 chip and deploy vue project

Recommend

Three ways to forward linux ssh port

ssh is one of the two command line tools I use mo...

How to install Linux flash

How to install flash in Linux 1. Visit the flash ...

MySQL operations: JSON data type operations

In the previous article, we introduced the detail...

Pagination Examples and Good Practices

<br />Structure and hierarchy reduce complex...

mysql row column conversion sample code

1. Demand We have three tables. We need to classi...

JavaScript implements countdown on front-end web page

Use native JavaScript to simply implement the cou...

Detailed explanation of browser negotiation cache process based on nginx

This article mainly introduces the detailed proce...

Detailed explanation of JSONObject usage

JSONObject is just a data structure, which can be...

Research on the Input Button Function of Type File

<br />When uploading on some websites, a [Se...

Install Docker on CentOS 7

If you don't have a Linux system, please refe...

Detailed explanation of 10 common HTTP status codes

The HTTP status code is a 3-digit code used to in...

How to remove the blue box that appears when the image is used as a hyperlink

I recently used Dreamweaver to make a product pres...

Vue implements bottom query function

This article example shares the specific code of ...

Vue+Element UI realizes the encapsulation of drop-down menu

This article example shares the specific code of ...