(function() {
    $('a.maximize').click(function() {
        $($(this).attr('href')).animate({
        position: "absolute",
        top: 0,
        left: 0,
        height: '99.5%',
        width: '99.5%',
        opacity: 1,
  },1000)
});
});
$(function() {
    $('a.minimize').click(function() {
        $($(this).attr('href')).slideToggle();
});
});

this is my code , but why the a.minimize no function after click the a.maximize

how do i use them over and over.

1 answer

o.k.w 2355
0
points

There are a few problems with the implementation. First I assume the HTML is something like this:

<a class="maximize" href="#targetElem">Max</a>
<a class="minimize" href="#targetElem">Min</a>
<div id="targetElem">
Target Element
</div>

Now the problem, jQuery's slideToggle(), toggles between showing and hiding the element by sliding effect. Hence clicking on the a.minimize will actually perform the showing and hiding of the target element.

The function attached to the a.maximize's click event peforms the animation to the configured properties. If this is clicked first, the target element will 'morph' to those CSS properties. Clicking on a.minimize will then hide it.

I'm not sure what exactly are your requirements, is it minimized onload? Do you need to disable a.minimize when minimized and a.maxmize when maximized? You will also need to handle click DURING the animation, e.g by stopping the in-progress animation.

Answered almost 7 years ago by o.k.w