Widget:OuterImage

小部件文檔

這個文檔是內聯文檔。

用於在討論頁插入外部圖片。請使用{{外部圖片}}調用。

JavaScript腳本：User:Bhsd/widget/outerImage.js

CSS樣式表：

 */
.outerImage { /* 外层容器，防窄屏上图片过宽 */
	overflow-x: auto;
	max-width: 100%;
	vertical-align: bottom; /* Safari */
}
.outerImage > div { /* 内层容器，可以裁剪 */
	overflow: hidden;
}
.badImage {
	position: relative;
	pointer-events: none;
	width: 50px !important;
	height: 50px !important;
}
.badImage::before {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	background-image: url("data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9JzMwMHB4JyB3aWR0aD0nMzAwcHgnICBmaWxsPSIjMDAwMDAwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB2ZXJzaW9uPSIxLjEiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSIwIDAgMzAgMzAiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKC01NzAgLTgwKSI+PGcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayI+PGNpcmNsZSBjeD0iNTc5IiBjeT0iOTIiIHI9IjIiPjwvY2lyY2xlPjxwb2x5Z29uIHBvaW50cz0iNTkwLjkwOCw4NiA1OTAuMzE1LDg4IDU5NSw4OCA1OTUsMTAzIDU4NS44NzEsMTAzIDU4NS4yNzgsMTA1IDU5NywxMDUgNTk3LDg2ICAgIj48L3BvbHlnb24+PHBhdGggZD0iTTU4Ni4xNjcsMTAySDU4OGg2di0yLjg1N2MtMS45OTctMi43NzYtMi45NTQtNi42NTctNC44ODMtNy4wOThMNTg2LjE2NywxMDJ6Ij48L3BhdGg+PHBhdGggZD0iTTU4OC4wNDEsODEuNzE2TDU4Ni43NzEsODZINTczdjE5aDguMTQzbC0xLjEwMiwzLjcxNmwxLjkxOCwwLjU2OGw4LTI3TDU4OC4wNDEsODEuNzE2eiBNNTgzLjMxLDk3LjY4MiAgICBjLTAuNjY4LTAuODYxLTEuMzQtMS4zOTYtMi4wNi0xLjM5NmMtMS45NTUsMC0yLjY3NCw0LjE1Ny01LjI1LDQuOTk5VjEwMmgyLjI1aDMuNzgxbC0wLjI5NiwxSDU3NVY4OGgxMS4xOEw1ODMuMzEsOTcuNjgyeiI+PC9wYXRoPjwvZz48L2c+PC9zdmc+");
	background-size: contain;
}
.outerImage .external { /* 只要JS */
	background-image: none;
	padding-right: 0;
}
.outerImage img {
	width: 100%;
	height: 100%;
}
.badImage img {
	display: none;
}
/*