Using css: jquery toggle issue, no error though on newest questions tagged css – Stack Overflow
EDIT: Sorry I should’ve elaborated better, hurried posting the question. Absolutely nothing happens when I click it. I’ll get a jfiddle up in a secong
I hate asking these questions but I have no clue what is wrong with this. I’ve checked this code over and over and over for the last 40mins and it’s too simple to be spending that much time on. Oh and there’s no syntax or any other error.
$(function () {
$('#filter-tab').toggle(
function () {
//$('#m_img').css('background-position','-4px -22px');
//$('#feedback_form').css('display','block');
$('#filter-section').animate({
'width': '350'
}, 500);
}, function () {
//$('#m_img').css('background-position','-69px -22px');
$('#filter-section').animate({
'width': '0'
}, 500);
});
});
I literally just used this code but for changing the height of the element instead of the width (which is why there is commented out code so ignore that) and it worked just fine but now all i did was change height to width and change the elements being used.
Here is another relevant code:
HTML
<div id="filter-section">
<div id="filter-tab">
<span id="filter-tab-txt">>>
<p>FILTERS</p>
</span>
</div>
<div id="filter-menu">Hello, world!</div>
</div>
CSS
div#filter-section {
position: absolute;
display: block;
width: 0;
height: 500px;
float: left;
background-color: #999999;
}
div#filter-tab {
position: absolute;
top: 0;
right: -30px;
height: 100px;
width: 40px;
background: #fcfff4;
/* Old browsers */
background: -moz-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
/* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fcfff4), color-stop(40%,#dfe5d7), color-stop(100%,#b3bead));
/* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #fcfff4 0%,#dfe5d7 40%,#b3bead 100%);
/* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #fcfff4 0%,#dfe5d7 40%,#b3bead 100%);
/* Opera 11.10+ */
background: -ms-linear-gradient(top, #fcfff4 0%,#dfe5d7 40%,#b3bead 100%);
/* IE10+ */
background: linear-gradient(top, #fcfff4 0%,#dfe5d7 40%,#b3bead 100%);
/* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfff4', endColorstr='#b3bead',GradientType=0 );
/* IE6-9 */
-webkit-border-bottom-right-radius: 15px;
-moz-border-radius-bottomright: 15px;
border-bottom-right-radius: 15px;
border-bottom: 1px solid #999;
border-right: 1px solid #999;
}
div#filter-tab:hover {
cursor: pointer;
}
span#filter-tab-txt {
position: absolute;
top: 3px;
right: 5px;
font-weight: bold;
color: #333;
}
#filter-tab-txt > p {
writing-mode: tb-rl;
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-o-transform: rotate(90deg);
white-space: nowrap;
display: block;
position: absolute;
top: 20px;
right: 5px;
width: 20px;
height: 20px;
font-weight: bold;
}
div#filter-menu {
display: none;
}
source: http://stackoverflow.com/questions/11147685/jquery-toggle-issue-no-error-though
Using css: using-css
Recent Comments