How do I animate a div inside an iframe using Jquery?

Posted on 2011-05-09
Last Modified: 2012-08-14
I have a main page and on it I have a button and an iframe. Inside the iframe I have an external html page with a div on it. Using the button on the main page how do I animate the div inside the iframe?

I have tried something like this:
            $("#iFrameID").contents().find("#divID").animate({"top": "-450px"},{ queue:false, duration:800, easing:"quartEaseInOut"});

This does not work. Could anyone show me how to fix this code?
I am attaching a test project here.
Question by:badwolfff

    Expert Comment

    You can reload the iframe, with some parameters, for it to animate. <iframe src='externalpage.html?animate=1'>

    and ofcourse make the externalpage.html, trigger the script on the GET animate = 1

    Author Comment

    sorry could you please illustrate with an example?
    I didn't really understand your explanation.

    Accepted Solution


    Author Closing Comment


    Featured Post

    Course: HTML5 Mobile App Development with PhoneGap

    PhoneGap can help you leverage your already existing HTML5, JavaScript, and CSS skills in order to create and deploy cross-platform mobile apps.This program comprehensively covers HTML5 mobile app development from top to bottom.

    Join & Write a Comment

    This article discusses the difference between strict equality operator and equality operator in JavaScript. The Need: Because JavaScript performs an implicit type conversion when performing comparisons, we have to take this into account when wri…
    This is a PowerShell web interface I use to manage some task as a network administrator. Clicking an action button on the left frame will display a form in the middle frame to input some data in textboxes, process this data in PowerShell and display…
    In this tutorial viewers will learn how to code links for mobile sites that, once clicked, send a call or text to a specified number. For a telephone link (once clicked, calls a number), begin with a normal "<a href=" link tag. For the href, specify…
    In this tutorial viewers will learn how to embed an audio file in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: : The declaration should display (CODE) HTML5 is supported by the most recent versions of all major browsers…

    728 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    21 Experts available now in Live!

    Get 1:1 Help Now