使用纯JavaScript或jQuery调整div的大小放大缩小 [英] resize div zoom in zoom out using pure javascript or jquery

问题描述

我有一个页面在div容器中显示swf游戏

i have a page displaying a swf game within a div container

我需要在此页面上添加一个放大缩小滑块，以便用户可以使用滑块调整swf文件的大小

i need to add a zoom in zoom out slider to this page so user can resize the swf file using a slider

例如此页面滑块的示例:

an example like this page slider :

喜欢此页面 http://www.agame.com/game/Snowflake- Puzzle.html

请帮忙

非常感谢

推荐答案

您看过源代码吗?答案就在那里:

Did you look at the source? the answer is right there:

<script type="text/javascript">
<!--
    var startGameWidth = 700;
    var startGameHeight = 550;
    var startMainContentWidth = $('div#maincontent').width();
    var startBlueboxMiddleWidth = $('div.bluebox:first div.top div.middle').width();

    function zoomObject(pos,slider){
        var newWidth = Math.ceil( pos*startGameWidth/100 );
        var newHeight = Math.ceil( pos*startGameHeight/100 );

        if( newWidth < startBlueboxMiddleWidth ) {
            $('div#maincontent, div.bluebox:first').css({'width': startMainContentWidth+'px'});
            $('div.bluebox:first div.middle').css({'width': startBlueboxMiddleWidth+'px'});
        } else {
            $('div#maincontent, div.bluebox:first').css({'width': (newWidth+30)+'px'});
            $('div.bluebox:first div.middle').css({'width': (newWidth)+'px'});
        }

        $("#flashobj").css({'width': newWidth+'px','height': newHeight+'px'});
    }
-->
</script>

这篇关于使用纯JavaScript或jQuery调整div的大小放大缩小的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！