jquery - Animation not working in wordpress -

-

am ripping hair out trying implement simple jquery animation worked on site did. change i've made in wanting affect animation different object selector (hoping i'm using these terms correctly). oddly, when test use exact same scenario previous site, no results.

can see obvious reason isn't working?

this jquery:

jquery(document).ready(function($){     $(".themelist li").hover(         function () {             $(".themedescription").animate({opacity:"1"});         },         function () {             $(".themedescription").animate({opacity:'0'}, "fast");         }     );   });

this loop (wordpress):

echo "<div class='themelist'><ul>"; foreach ( $terms $term ) {     echo "<li>" . $term->name ."</li><div class='theme-description'>". $term->description. "</div>"; } echo "</ul></div>";

this css:

.themelist { position: relative; cursor: pointer; }  .themelist li {width:200px;}  .theme-description { text-align: left; color: #ccc; background: #333; width:300px; position: absolute; padding: 20px; top:0; left:200px; opacity:0; }

ideas? have searched on , cannot figure out i'm going wrong.

update

making progress, , have whole new problem. following adjusted jquery finallyw works far making animation run:

$(document).ready(function() { $(".themelist li").hover(function()     { $(".themedescription").filter(':not(:animated)').animate({opacity:"1"});     }, (function()     { $(".themedescription").animate({opacity:"0"});     } ));  });

but can imagine, instead of div appearing 1 one, each corresponding link in list, appear @ same time. gah. should have seen coming, sort of assumed behave similar css display:none, , show 1 @ time.

is there effect can use fix this? or need generate individual classes div .themedescription becomes .themedescription1, .themedescription2, etc?

many again. ideas appreciated. -jennyb

.themedescription on jquery code typo error against html/wordpress code...

please use .theme-description on jquery code.... dash...


Comments

Post a Comment

Popular posts from this blog

ruby - Trying to change last to "x"s to 23 -

-
i have been playing around irb , have string looks this: irb(main):072:0> puts ["[\"4354 5432 5432 xxxxx\", \"6547 6547 8543 xxxxx\", \"2344 6543 6674 xxxxx\", \"2346 6236 7543 xxxxx\", \"1273 5585 5587 xxxxx\"]"] => nil irb(main):073:0> what want gsub last 2 "x" s of each 17 digit combination, 23 . what i've tried far (i've been using rubular): a.gsub(/\d[x]/,"23") <= grabs "x" s i'm close a.gsub(/\w[x{2}]/,"23") <= grabs "x" s grabs two digits each combination. is there easier way i'm not understanding? a.gsub(/\d{4} \d{4} \d{4} xxx\kxx/, '23') \d{4} = 4 digits what \k drop matched far. can use don't replace entire number, still able validate have in desired format.
Read more

jquery - Clone last and append item to closest class -

-
this bare-bones code on page: <div class="list-container"> <div class="single-list-item"> <button>remove</button> </div> <div class="single-list-item"> <button>remove</button> </div> <div class="single-list-item"> <button>remove</button> </div> </div> <p><button class="add-list-item">add</button></p> <div class="list-container"> <div class="single-list-item"> <button>remove</button> </div> <div class="single-list-item"> <button>remove</button> </div> <div class="single-list-item"> <button>remove</button> </div> </div> <p><button class="add-list-item">add</button></p> <di...
Read more

css - Can I use the :after pseudo-element on an input field? -

-
i trying use :after css pseudo-element on input field, not work. if use span , works ok. <style type="text/css"> .mystyle:after {content:url(smiley.gif);} .mystyle {color:red;} </style> this works (puts smiley after "buu!" , before "some more") <span class="mystyle">buuu!</span>a more this not work - colors somevalue in red, there no smiley. <input class="mystyle" type="text" value="somevalue"> what doing wrong? should use pseudo-selector? note: cannot add span around input , because being generated third-party control. :after , :before not supported in internet explorer 7 , under, on elements. it's not meant used on replaced elements such form elements (inputs) , image elements . in other words it's impossible pure css. however if using jquery can use $(".mystyle").after("add smiley here"); api docs on .after to ...
Read more