ホームページ ウェブフロントエンド jsチュートリアル jQuery divlayer_jqueryを拡大・縮小するための簡単な実装コード

jQuery divlayer_jqueryを拡大・縮小するための簡単な実装コード

May 16, 2016 pm 05:39 PM
拡大する ズームアウトする

复制代幣代码如下:

<html xmlns="http://www.w3.org /1999/xhtml">
<head runat="server">
<title></title>
<style type="text/css">
.content
{
border: 1px ソリッド #ccc;
幅: 440ピクセル;
オーバーフロー: 非表示;
マージン: 10px;
}
</style>
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
if ($('#content').height() > 400)
$('#content').height(400);
$('#bigger').toggle(function() {
$('#content').height($('#content').height() 100);
$(' #bigger').html('缩小');
}, function() {
$('#content').height($('#content').height() - 100); 🎜>$('#bigger').html('放大')
})
});
</script>
</head>

<div id="コンテンツ" class="コンテンツ">
內容1

內容2

內容3

內容4

內容5

內容量6

內容7

內容8

內容9

內容10

內容11

內容12

內容13

內容14

內容15

內容16

內容17

內容18

內容19

內容20

內容21

內容22

內容23

內容24

內容25




<span id="bigger">放大</span>
</body>
</html>

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットな記事タグ

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

Vue を通じて画像の特定領域のズーム機能を実装するにはどうすればよいですか? Vue を通じて画像の特定領域のズーム機能を実装するにはどうすればよいですか? Aug 26, 2023 pm 04:43 PM

Vue を通じて画像の特定領域のズーム機能を実装するにはどうすればよいですか?

HTML、CSS、および jQuery: 画像のズームインおよびズームアウトの特殊効果を実現するテクニック HTML、CSS、および jQuery: 画像のズームインおよびズームアウトの特殊効果を実現するテクニック Oct 24, 2023 am 10:22 AM

HTML、CSS、および jQuery: 画像のズームインおよびズームアウトの特殊効果を実現するテクニック

Windows 10 の検索バーのサイズを変更するためのガイド Windows 10 の検索バーのサイズを変更するためのガイド Jan 04, 2024 pm 05:22 PM

Windows 10 の検索バーのサイズを変更するためのガイド

macOS のクリップボード履歴のロックを解除し、効率的なコピー アンド ペーストのテクニックを使用する macOS のクリップボード履歴のロックを解除し、効率的なコピー アンド ペーストのテクニックを使用する Feb 19, 2024 pm 01:18 PM

macOS のクリップボード履歴のロックを解除し、効率的なコピー アンド ペーストのテクニックを使用する

uniappを使用して画像の拡大縮小機能を実装する uniappを使用して画像の拡大縮小機能を実装する Nov 21, 2023 am 11:58 AM

uniappを使用して画像の拡大縮小機能を実装する

Yitian Cameraで写真の一部を拡大する方法 Yitian Cameraで写真の一部を拡大する方法 Feb 23, 2024 pm 01:58 PM

Yitian Cameraで写真の一部を拡大する方法

純粋な CSS を通じて画像のズーム効果を実現する方法 純粋な CSS を通じて画像のズーム効果を実現する方法 Oct 18, 2023 am 11:00 AM

純粋な CSS を通じて画像のズーム効果を実現する方法

WPSを画面サイズの半分に縮小する方法 WPSを画面サイズの半分に縮小する方法 Mar 20, 2024 pm 09:40 PM

WPSを画面サイズの半分に縮小する方法

See all articles