0

私はJavaScriptに比較的慣れていません。本文とロゴ xxcloud.gif (サイズを変更したい) を表示する html インデックス ページのコードを次に示します。

<body  id="page1">
        <div class="tail-top">
            <div class="tail-bottom">
                <div class="main">
                    <div id="header">
                        <ul>
                 <li class="first"><a href="index.html" class="current">Home page</a></li>
                            <li><a href="index-1.html">Company</a></li>
                            <li><a href="index-2.html">Registration</a></li>
                            <li><a href="index-3.html">IT Services</a></li>
                            <li><a href="index-4.html">Questionnaire</a></li>
                            <li><a href="index-5.html">Contact Us</a></li>
                        </ul>
                        ...
                        ...

                        <div><a href="index.html"><img alt="" src="images/xxcloud.gif"  
                        class="logo" id="resizeLogo" /></a><br /></div>

JavaScript コードは次のとおりです。

<script type="text/javascript">
                            window.onresize = function() {
                                resizeToScreen(document.getElementById("resizeLogo"), 35);
                            };
                            /* 
                             * logo resize
                             */
                            function resizeToScreen(element, percent)
                            {
                                var wHeight = window.innerHeight;
                                var objHeight = wHeight * (percent / 100);
                                element.style.height = objHeight + "px";

                                var wWidth = window.innerWidth;
                                var objWidth = wWidth * (percent / 100);
                                element.style.width = objWidth + "px";
                            }
                        </script>

IDはおそらくdivタグにあるはずです。問題は、ロゴをクリックしてドラッグして大きくしたり小さくしたりするときに、ロゴのサイズを変更するにはどうすればよいかということです。

私はこのサイトを初めて使用しますが、JavaScript ではなく JQuery でソリューションを作成することを好む人もいます。Jquery を使用する利点は何ですか?

前もって感謝します

デイブ

//別の方法で編集: ?? を使用できます

window.onresize = function(){  document.getElementById("resizelogo").style.height = "15%";
                               document.getElementById("resizelogo").style.width = "15%"; }
4

0 に答える 0