调整主页徽标的大小

时间:2013-07-05 20:47:35

标签: javascript html image-resizing graphical-logo

我对JavaScript比较陌生。这是html索引页面的代码,显示正文和徽标xxcloud.gif(我想调整大小)。

<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标签中。问题是如何在点击徽标并拖动它以使徽标变大或变小时如何调整徽标大小。

我是这个网站的新手但有些人更喜欢用JQuery而不是JavaScript来编写解决方案。使用Jquery有什么好处?

提前致谢

戴夫

//或者编辑:我可以使用??

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

0 个答案:

没有答案