Използвам малко jquery, за да разширя div, когато се щракне върху друг:
<script type="text/javascript">
$(document).ready(function() {
$(".flip").click(function() {
$(".module").slideToggle("slow");
});
});
</script>
Това е моят html:
<div class="flip"></div>
<div class="module"></div>
И има много текст в div на модула. Това е моят css:
.module {
width:374px;
height:100%;
float:left;
padding:5px;
display:none;
}
.flip {
width:100%;
height:25px;
background-image:url(menu.gif);
cursor:pointer;
}
Моят сайт е отзивчив, така че когато прозорецът на браузъра се преоразмери, горният css се показва, когато екранът е по-малък от 800 пиксела. Така че, когато тествам, щраквам върху моя бутон, което кара модула ми да се разширява, не е проблем, и когато щракна върху бутона отново, модулът се свива и скрива съдържанието си, така че всичко е наред. Въпреки това, когато преоразмеря прозореца си обратно, да речем 1000px, и бях скрил съдържанието на модула, когато екранът ми беше по-малък, съдържанието все още е скрито, когато прозорецът на браузъра се върне на 1000px и скрих бутона за по-големите екрани, защото не е нужно. И така, има ли някакъв начин да нулирате ефектите на jquery, когато прозорецът на браузъра е преоразмерен до размер, по-голям от 800px?
