Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Nov 2011
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    jQuery, how to change HTML <object> attributes?

    I can't seem to change object attributes in html while using jQuery. It works on images... Can does it just not work on swf objects?

    Here is my code:

    HTML::
    Code:
    <input type="button" id="larger" value="Big" />
    <input type="button" id="smaller" value="Small" />
    <object id="game" width="550" height="400">
            <param name="game" value="Games/swf_games/4SecondFrenzy.swf">
            <param name="quality" value="high">
            <embed src="Games/swf_games/4SecondFrenzy.swf" quality="high" type="application/x-shockwave-flash" width="550" height="400"></embed>
    </object>
    jQuery:: (obviously under $(document).ready()
    Code:
    $('#larger').click(function(){
    		$('object').attr({
    			'width': '825',
    			'height': '600'
    		});
    	});
    	
    $('#smaller').click(function(){
    		$('object').attr({
    			'width': '225',
    			'height': '200'
    		});
    	});

    Thank you very much!

  • #2
    New Coder
    Join Date
    Nov 2011
    Location
    New England
    Posts
    62
    Thanks
    0
    Thanked 10 Times in 10 Posts
    weird.. I tried manually typing in the code on Chrome's console, and afterwards when I called the object, it said the width and height were what I had entered. But the object didn't seem to move at all. Of course, I don't have the .swf, but I added a color border and it was kind of small and rectangular and seemed like it was cut off somewhere but it still didn't seem to move.
    For programming information, visit irnsystems.com
    Also check out Points2Survey and earn items.

  • #3
    Regular Coder
    Join Date
    Jan 2008
    Location
    Geneva, Switzerland
    Posts
    413
    Thanks
    12
    Thanked 29 Times in 29 Posts
    Works fine using HTML5 <object> tag.

    http://www.w3schools.com/html5/tag_object.asp

    Code:
    <!DOCTYPE html>
    <html>
        <head>
            <title>Hello World</title>
            <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
    
            <script type="text/javascript">
                $(function() {
        
                    $('#larger').click(function() {
                        $('object').attr({
                            'width': '825',
                            'height': '600'
                        });
                    });
    	
                    $('#smaller').click(function() {
                        $('object').attr({
                            'width': '225',
                            'height': '200'
                        });
                    });
                })
            </script>
        </head>
    
        <body>
    
            <input type="button" id="larger" value="Big" />
            <input type="button" id="smaller" value="Small" />
    
            <object height="400" width="400" data="http://www.w3schools.com/html5/helloworld.swf"></object>
    
        </body>
    </html>
    Chuck Norris counted to infinity.
    Twice.


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •