デモページ
どういう場面で使うかは、なかなか難しいですが $(document.body).find("*") なんかは手軽で使い勝手が良いと思います。あと、$([parent.document.body,document.body,$("#target")[0],$("#tabs-1")[0]]) なんかは狙い撃ち用です
ソースコード
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<script>
// jQuery 初期処理
$(function() {
// プラグイン
$.fn.extend({
rotateAction: function(deg, duration, easing){
var target = this;
$({kakudo: 0}).animate(
{kakudo: deg},
{
duration: duration,
easing: easing,
step: function(now) {
target.css({
transform: 'rotate(' + now + 'deg)'
});
}
}
);
}
});
});
</script>
<input
type="button"
value="画像回転"
onclick='$("#target").rotateAction(360,1000,"swing");'>
<input
type="button"
value="この IFRAME を回転"
onclick='$(document.body).rotateAction(360,1500,"swing");'>
<input
type="button"
value="このタブのみ回転"
onclick='$("#tabs-1").rotateAction(360,1500,"swing");'>
<input
type="button"
value="ウインドウ全体を回転"
onclick='$(parent.document.body).rotateAction(360,1500,"swing");'>
<input
type="button"
value="全てを回転"
onclick='$([parent.document.body,document.body,$("#target")[0],$("#tabs-1")[0]]).rotateAction(360,10000,"swing");'
style="background-color:deeppink;color:white">
<input
type="button"
value="何もかも回転"
onclick='$(document.body).find("*").rotateAction(360,10000,"swing");'
style="background-color:deeppink;color:white">
<br><br><br>
<img
id="target"
src="https://lh5.googleusercontent.com/-kCYTSmTrJXs/URvMQy9ClqI/AAAAAAAARuw/5BTKTk2c_sw/s128/_img.png"
style="border: solid 0px #000000">
|
|
【IFRAME パッケージの最新記事】
- CSS の calc 関数を使って、IFRAME を画面下半分にフィットさせる
- jQuery プラグイン : Columns と PHP の連携と、ドキュメントには書かれていないカスタマイズ方法
- １会話・IFRAME(TCPDF)テンプレート : jQuery + Bootstrap(css) + mmenu + Firebase + TCPDF + PHP
- jquery.ajax-combobox(オートコンプリートとドロップダウンリストを組み合わせたコンボボックス) を使用して、入力可能なコンボックス( しかもリストはページャ付き )
- jquery.ajax-combobox で JSON をデータに使う場合、複数項目を検索対象にする為の簡単な改造
- FileSaver.js と canvas-toBlob.js を使って、canvas で表示されているイメージを保存する
- クリックしたコンテンツ以外を暗転する jQuery TOOLS の expose プラグイン
- tabIndent.js : テキストエリアでタブが使用できます。オリジナルを少し改造して、jQuery の名前空間に登録しました。
- jQuery UI の タブ と アコーディオンで、スキンのチェック
- tableMagic で作成されたテーブルを fixedheadertable でヘッダと左端列を固定 / jQuery プラグイン
- jQuery : Columns で作成されたテーブルを fixedTblHdrLftCol でヘッダと左列を固定( CSS カスタマイズ )
- IOS のようなスクロールバーインターフェイスを jQuery のプラグインとして実現する jQuery.NiceScroll
- jQuery : 一つの 複数選択の SELECT 要素から二つのリストボックスを作成して、必要なグループ選択するプラグイン / multiselect.js と PHP との連携
- jQuery プラグイン mmenu( 左右からスライドインするメニュー ) を F1 キーと F2 キーに割り当てて、左右から二つのメニューを開く
- jQuery で、ページ内で F1 キー(HELP) を起動させないようにする / IFRAME 内も同時対応
- FRAME の代替として使う IFRAME パッケージ
