jquery - Selecting nth level child to manipulate width of the DIV -
i'm working on zoom-in , zoom-out section of site. issue i'm facing i'm not being able <div>
class=product-view
.
below html code have:
<div id="tabs-1" aria-expanded="true" aria-hidden="false"> <div class="drag-drop-box ui-droppable"> <div class="component ui-draggable dropped" style="position: relative;"> <div class="product-view"> <a href="#"><span>c</span> us-east-1c</a> </div> </div> </div> </div>
and jquery code i'm using:
$("#zin").click(function(){ var wid = $('div[aria-hidden="false"]').width(); var getid = $('div[aria-hidden="false"]').attr('id') alert(wid); alert(getid); $('#'+getid > div > div).children('.product-view').css('width','90px'); });
can suggest needs done serve purpose? thanks
html>
<div id="tabs-1" aria-expanded="true" aria-hidden="false"> <div class="drag-drop-box ui-droppable"> <div class="component ui-draggable dropped" style="position: relative;"> <div class="product-view"> <a href="#"><span>c</span> us-east-1c</a> </div> </div> </div> </div> <input type="button" id="zin" value="zoom in"/> <input type="button" id="zout" value="zoom out"/>
css >
.product-view{ border:1px solid black; font:bold 12pt 'tahoma'; display:table; } .product-view.expanded{ font:bold 24pt 'tahoma'; }
jquery >
$("#zin").click(function(){ var wid = $('div[aria-hidden="false"]').width(); var getid = $('div[aria-hidden="false"]').attr('id') $('#'+getid + '> div > div').children('.product-view').addclass('expanded'); }); $("#zout").click(function(){ var wid = $('div[aria-hidden="false"]').width(); var getid = $('div[aria-hidden="false"]').attr('id') $('#'+getid + '> div > div').children('.product-view').removeclass('expanded'); });
Comments
Post a Comment