Search Results

Search found 1146 results on 46 pages for 'divs'.

Page 19/46 | < Previous Page | 15 16 17 18 19 20 21 22 23 24 25 26  | Next Page >

  • jQuery slideToggle() Internet Explorer problem and jumpy animation

    - by UtothaX
    Hey yaa! I have a big problem with my jquery. I finally made it that my slidetoggle runs in firefox. The animation is a little bit jumpy in the end of the animation. I read a lot of workarounds, but somehow nothing helped me really. Perhaps anyone of you can rescue me out of this dilemma. The other bigger problem is that the hidden divs are unfortunately shown directly on start in internet explorer. I tested it in IE6&7. And the sliding effect is also very strange. Does anyone of you know if I have to give additional styling for IE??? Here is my site I am working on: http://www.haus-plan.de/%5F01%5FHausplan/ the red titles are slideable in the content area and the two Slide words on the right panel. I noticed that Internet Explorer runs the first Slide word on the right panel correctly. Here its div is first hidden and only shows up when we click and let it slide down. But for the other divs they are shown in the beginning which is very sh..... Please help meee....

    Read the article

  • Increment variable for

    - by John Doe
    Hello. I have 30 divs with the same class on the same page. When i'm pressing the title (.pull) the content is sliding up (.toggle_container). When the content is hidden and i'm pressing the title again, the content is sliding down. Also, i want to store the div state inside a cookie. I modified my original code to store the div state inside a cookie but it's not working for all the divs (pull1, toggle_container1, pull2, toggle_container2 [...]), it's working only for the first one (pull0, toggle_container0). What i'm doing wrong? var increment = 0; if ($.cookie('showTop') == 'collapsed') { $(".toggle_container" + increment).hide(); }else { $(".toggle_container" + increment).show(); }; $("a.pull" + increment).click(function () { if ($(".toggle_container" + increment).is(":hidden")) { $(".toggle_container" + increment).slideDown("slow"); $.cookie('showTop', 'expanded'); increment++; } else { $(".toggle_container" + increment).slideUp("slow"); $.cookie('showTop', 'collapsed'); increment++; } return false; });

    Read the article

  • Using jQuery.UI CSS Framework for DIV Styling

    - by Gordon
    Hi folks, a Project I am currently working on uses the jQuery UI framework for some of its widgets. To provide the user with a global look and feel I would like to use the framework also for its css stuff. I am implementing at the moment a dashboard like homepage, where the user can see an overall status of its data. This dashboard is build of some divs that should be aligned into a grid layout. I try to style the divs like follows <div class="ui-widget"> <div class="ui-widget-header">Box Header</div> <div class="ui-widget-content"> Content of the Box </div> </div> Later I would like to implement some draggable-and-sortable functionality. The Problem I am facing right now is that the boxes aren't properly aligned. Does anyone has a hint on using jQuery.UI for that kind of css work? I was studing the CSS framework documentation on jqueryui.com but there aren't that much information. best regards, Gordon

    Read the article

  • Help with pregreplace and uniqid for jquery dialog boxes

    - by Scarface
    First of all, do not be overwhelmed by the long code, I just put it for reference...I have a function that runs preg_replace on each comment users post and puts matches in a jquery dialog box with a matching open-link. For example, if there is a paragraph with two matches, they will be put inside two divs, and a jquery dialog function will be echoed twice; one for each div. While this works for one match, if there are multiple matches, it does not. I am not sure how to distribute unique ids at a point in time for each of the divs and matching dialog open-scripts. Keep in mind, I removed the preg replace function since it kind of complicates the problem. If anyone has any ideas, they will be greatly appreciated. <?php $id=uniqid(); $id2=uniqid(); echo "<div id=\"$id2\"> </div>"; ?> $.ui.dialog.defaults.bgiframe = true; $(function() { $("<?php echo"#$id2"; ?>").dialog({hide: 'clip', modal: true ,width: 600,height: 350,position: 'center', show: 'clip',stack: true,title: 'title', minHeight: 25, minWidth: 100, autoOpen: false}); $('<?php echo"#$id"; ?>').click(function() { $('<?php echo"#$id2"; ?>').dialog('open'); }) .hover( function(){ $(this).addClass("ui-state-hover"); }, function(){ $(this).removeClass("ui-state-hover"); } ).mousedown(function(){ $(this).addClass("ui-state-active"); }) .mouseup(function(){ $(this).removeClass("ui-state-active"); }); });

    Read the article

  • Dropdown menu disappears in IE7

    - by Justine
    A weird problem with a dropdown menu in IE7: http://screenr.com/SNM The dropdown disappears when the mouse moves to a part that hovers above other layers. The HTML structure looks like this: <div class="header"> <ul class="nav> <li><a href="">item</a> <ul><li><a href="">sub-item</a></li></ul> </li> </ul> </div><!-- /header--> <div class="featured"></div> <div class="content"></div> The sub-menu is positioned absolutely and has visibility:hidden, then it's set to visible using jQuery, like so: $(".header ul.nav li").hover(function(){ $(this).addClass("hover"); $('ul:first',this).css('visibility', 'visible'); }, function(){ $(this).removeClass("hover"); $('ul:first',this).css('visibility', 'hidden'); }); I had a problem with the dropdown hiding under other content in IE7, fixed easily by giving the z-index to its parent and other divs: *:first-child+html .header { position: relative; z-index: 2 !important; } *:first-child+html .content, *:first-child+html .main, *:first-child+html .primary *:first-child+html .featured { position: relative; z-index: 1 !important; } Now, I have no idea why the menu disappears when hovered over other divs, you can view the site live here: http://dev.gentlecode.net/ama/ubezpieczenia.html I would love any help, been staring at this code for ages now without any solution. I guess it's just me tunnel visioning already... Thanks in advance for any help!

    Read the article

  • How to preload images using jquery for carousel?

    - by Pandiya Chendur
    I used jquery stepcarousel plugin and it works fine... But how to preload images that is used by the plugin... I am using this, <div id="mygallery" class="stepcarousel"> <div class="belt"> <div class="panel"> <img src="Images/img1.jpg" /> </div> <div class="panel"> <img src="Images/img2.jpg" /> </div> </div> </div> <script type="text/javascript"> stepcarousel.setup({ galleryid: 'mygallery', //id of carousel DIV beltclass: 'belt', //class of inner "belt" DIV containing all the panel DIVs panelclass: 'panel', //class of panel DIVs each holding content autostep: { enable: true, moveby: 1, pause: 3000 }, panelbehavior: { speed: 500, wraparound: false, persist: true }, defaultbuttons: { enable: true, moveby: 1, leftnav: ['Images/lft_arrow.jpg', -5, 220], rightnav: ['Images/rit_arrow.jpg', -5, 220] }, statusvars: ['statusA', 'statusB', 'statusC'], //register 3 variables that contain current panel (start), current panel (last), and total panels contenttype: ['inline'] //content setting ['inline'] or ['ajax', 'path_to_external_file'] }) </script> How to preload images used by mygallery div such that i can avoid flickering.....

    Read the article

  • Determining which form input failed validation?

    - by Alastair Pitts
    I am designing a creation wizard in ASP.NET MVC 1 and instead of posting back each step, I'm using javascript to toggle the display of the different steps divs. This is a quick sample of the code, just to explain. <% using (Html.BeginForm()) {%> <fieldset> <legend>Fields</legend> <div id="wizardStep1"> <% Html.RenderPartial("CreateStep1", Model); %> </div> <div id="wizardStep2"> <% Html.RenderPartial("CreateStep2", Model); %> </div> <div id="wizardStep3"> <% Html.RenderPartial("CreateStep3", Model); %> </div> </fieldset> <% } %> I have javascript that just toggles the visibility of the divs, with each partial view containing a different section of the input form (which is pretty large by itself) My question is, if the form fails validation and I reload the page with the validation errors, is there a way for me to determine which div contains the error? Either in javascript or other? Failing that, is there a good client-side validation library for MVC 1? Ideally I'd love to move to MVC2 and the client side validation built into that, but I am required to use MVC1

    Read the article

  • How to create a jpeg using set of div with backgrounds - PHP/jQuery

    - by Dasun
    The final output of the image looks like this below. If you look into html parts, It's create using different divs as below. All the div are placed one on one using CSS and making the position to absolute. <div id="tproduct" class="timage" style="z-index: 30; background-image: url('main-mask.png') ;"></div> <div id="tdesign1" class="timage" style="z-index: 20; background-image: url('design1.png');"></div> <div id="tdesign2" class="timage" style="z-index: 20; background-image: url('design2.png');"></div> <div id="tmaincolor" class="timage" style="background-color:blue;"></div> <div id="tembellishment" class="timage" style="z-index: 10; background-image: url('flower.png');"></div> If we look at separately it will look like this below. etc My question is how can I create a single image using above set of divs and images? I can use PHP or jQuery? I only want the steps or guidance how it should be done. Thanks

    Read the article

  • regex php: find everything in div

    - by Fifth-Edition
    I'm trying to find eveything inside a div using regexp. I'm aware that there probably is a smarter way to do this - but I've chosen regexp. so currently my regexp pattern looks like this: $gallery_pattern = '/([\s\S]*)<\/div/'; And it does the trick - somewhat. the problem is if i have two divs after each other - like this. <div class="gallery">text to extract here</div> <div class="gallery">text to extract from here as well</div> I want to extract the information from both divs, but my problem, when testing, is that im not getting the text in between as a result but instead: "text to extract here text to extract from here as well" So . to sum up. It skips the first end of the div. and continues on to the next. The text inside the div can contain "<", "/" and linebreaks. just so you know! Does anyone have a simple solution to this problem? Im still a regexp novice.

    Read the article

  • AJAX.NET __doPostBack changes other content

    - by Raul
    Hi. I have an application where a javascript reads the GPS location of the device and sends it to serverside script like this: f() { var initialLocation= Someshit(); document.getElementById('<% = text.ClientID %>').value=initialLocation; var button = document.getElementById('<% = Button4.ClientID %>'); button.click(); } And i have some AJAX.NET code: <asp:UpdatePanel ID="UpdatePanel1" runat="server"> <ContentTemplate> <asp:Button ID="Button4" runat="server" Text="PlaceHolder" onclick="Button4_Click"/> <asp:TextBox ID="text" runat="server"></asp:TextBox> </ContentTemplate> </asp:UpdatePanel> And a bit further down <asp:UpdatePanel ID="UpdatePanel2" runat="server"> <ContentTemplate> <div> <some divs and asp:gridviews and god knows what > </div> <ContentTemplate> </asp:UpdatePanel> The problem is that the the last divs inner content changes when the event of UpdatePanel1 has finished. Why is that? I don't want the content outside of UpdatePanel1 to be changed whenever UpdatePanel1 is doing its thing. Please help.

    Read the article

  • Dragging a copy of all selected elements from a select box--possible?

    - by Sean
    I have a picklist web interface: a pair of select elements with a pair of buttons (a left-pointing arrow and a right-pointing arrow) between them. Users can move items between the two columns by, eg, selecting one of options in the left column and clicking on the right-pointing arrow. Now I have an enhancement request: someone wants to be able to drag-and-drop items between the two columns instead of clicking a button. The problem with my initial two-select-box setup is that as soon as I click one of the highlighted options to initiate a drag, all of the other selected options are deselected. Using jQuery, I've attached mousedown event handlers to both the select boxes and each individual option that just call preventDefault() on the event object, but this isn't sufficient. On Firefox 3 the clicked-on option loses focus immediately, but all other options are still deseleted, and on IE6 (which I regrettably still have to support) it makes no difference at all. So I thought I could maybe create a reasonable facsimile of a select box using list elements or divs or something. I can create something reasonable-looking that works on Firefox, but on IE6, if I shift-click on an element of my pseudo-select object (in order to select a range of options), IE selects all of the text between where I click and the last place I clicked. Again, I've attached preventDefault-ing mousedown, mouseup, and click handlers to all of the elements involved, but it doesn't help. I've even tried overlaying transparent divs over both my original select boxes and my pseudo-select objects, thinking to intercept mouse clicks and manage the selections manually, but I can't make it work on IE. If I use a select box, I can't prevent clicks from changing the selection, and if I use text that just looks like a select element, I can't prevent it from selecting a range of text on a shift-click. Is there some general solution, or am I just out of luck?

    Read the article

  • Super simple CSS tooltip in a table, why is it not displaying and can I make it work?

    - by Kyle Sevenoaks
    Hi, I have been trying to implement many different tooltips on this page for my client, he's adamant that we have a picture of the product show up when you hover over the product name in the order page. I decided to use the super simple CSS tooltip, it's very easy to implement and does exactly what we want. It works on a dynamic page, the others I tried didn't. I have made an example here: CSS tooltip in table example. This page used to be displayed using divs, I have since changed it to a table, as it's tabular data and easier to work with. It worked fine when it used divs, now it's in a table, it won't display the span on hover. My questions are: Why is it not working? How can I make it work? If not, does anyone know another super easy to implement tooltip that can work properly on a dynamic page? Here's the DIV tooltip for reference: DIV display tooltip. Edit: Just noticed it kinda half works in IE8. Thanks.

    Read the article

  • CSS ] how to automatically resize the wrapper div.

    - by Phrixus
    Hi, I've been struggling with this problem.. There is a wrapper div and it contains 3 vertical column divs with full of texts, and this wrapper div has red background color so that it can be a background of the entire texts. <div id="content_wrapper"> <div id="cside_a"> // massive texts goes here </div> ... // two more columns go here. </div> And here is the CSS code for them. #content_wrapper { background-color:#DB0A00; background-repeat:no-repeat; min-height:400px; } #cside_a, #cside_b, #cside_c { float: left; width: 33%; } And this code gives me a background that covers only 400px height box.. My expectation was the wrapper div automatically resizes depending on the size of the divs in it. Somehow putting "overflow:hidden" with wrapper CSS code makes everything work fine. I have no idea why "overflow:hidden" works.. shouldn't this hide all the overflowed texts..? Could anyone explain me why? Is is the correct way to do it anyway?

    Read the article

  • Help me understand dynamic layouts in Sinatra

    - by thermans
    Help me understand this; I'm learning Sinatra (and Rails for that matter, er, and Ruby). Say I'm doing a search app. The search form is laid out in one div, and the results will be laid out in another. The search form is rendered into the div by a previous view (maybe from a login form). I want to process the form params, perform the search, and render the results into the results div. If I have a single "yield" in the layout and render the divs from different views, the results div erases the search div when it renders. If I define the divs in the default layout, then just render the content, obviously the layout will be messed up: there would have to be two "yields" and I don't think Sinatra supports passing blocks in to yields. I tried foca's sinatra-content-for plugin, and that seems closer to what I need. But I can't figure out where to place the "yield_content" statements. If I have this haml in my layout: #search -# search form = yield_content :search #results -# search results = yield_content :results ... this in my search view: - content_for :search do %form{:method => "post"... etc. ... and this in the results view: - content_for :results do %table{:class => 'results'... etc. This sort of works but when I render the results view, the search div is emptied out. I would like to have it remain. Am I doing something wrong? How should I set this up?

    Read the article

  • jQuery attribute question

    - by Nick Simone
    I'm trying to select a series of divs one at a time. I'm sure theres a better way to do this, but I gave them all unique rels and I'm using the rels to select them one at a time. I want to move them over the width of the div, then animate it dropping down the screen. What I have is: $(document).ready(function(){ var totalbricks = 7; var index = 2; $(".brick").animate({top:"600px"}); while(index < totalbricks) { var postion = 45*index; $(".brick[rel='+index+']").css('left', postion+'px'); $(".brick[rel='+index+']").animate({top:"600px"}); index++; } }); All the divs are in a container div. Jquery docs say, 'Variables can be used using the following syntax: [name='" +MyVar+ "']' What am I doing wrong? Here is the HTML that is being used by the jQuery <body> <div id="container"> <div id="canvas"> <div class="brick" rel="1"> </div> <div class="brick" rel="2"> </div> <div class="brick" rel="3"> </div> <div class="brick" rel="4"> </div> <div class="brick" rel="5"> </div> <div class="brick" rel="6"> </div> <div class="brick" rel="7"> </div> </div> </div> </body>

    Read the article

  • jquery clone only once

    - by tsiger
    I have a series of divs like this: <div id="available-posts"> <div class="post" id="unique_id"> <a href="#" class="addme">Add</a> Some text </div> <div class="post" id="unique_id"> <a href="#" class="addme">Add</a> Some text </div> </div> The unique_id is a different number for each of the divs. Now i have a new empty div like this <div class="related-posts"></div> And i clone items in there. The thing is that i want to check if an item is already cloned. If it is i want to stop it from being cloned again. This is how i clone items: // clone it $('.addme').live('click', function() { $(this).parents('div.thepost').clone().fadeIn('normal').appendTo('#related-posts').find('a.addme').html('Remove').removeClass('addme').addClass('removeme'); return false; }); // remove it $('.removeme').live('click', function() { $(this).parents('div.thepost').fadeOut('normal', function() {$(this).remove(); }); return false; }); In other words i want the cloned list to contain only unique items. Not for example 2 clones of the same post. *edit: i am using live coz the first list (available posts) is populated through an AJAX call.

    Read the article

  • jQuery toggling div visibility

    - by Eef
    I have a HTML document with the below setup: <div class="main-div" style="padding: 5px; border: 1px solid green;"> <div class="first-div" style="width: 200px; height: 200px; padding: 5px; border: 1px solid purple"> First Div <a href="#" class="control">Control</a> </div> <div class="second-div hidden" style="width: 200px; height: 200px; padding: 5px; border: 1px solid red;"> Second Div <a href="#" class="control">Control</a> </div> </div> I also have a CSS class setup called hidden with display setup to none. I have jQuery setup like so: $('.control').click(function(){ var master = $(this).parent().parent(); var first_div = $(master).find(".first-div"); var second_div = $(master).find(".second-div"); $(first_div).toggleClass("hidden") $(second_div).toggleClass("hidden") }); This setup toggles the visibility of the divs, click the control button it hides one div and show the other. However this just hides and shows each div in a flash. I am looking to add some animation to the transitioning of the divs, maybe have one slide up and the other slide down when the 'control' is clicked and vice versa but I am unable to achieve this. Could anyone help out and give some advice on how to do this? Cheer Eef

    Read the article

  • Adding jQuery event handler to expand div when a link is clicked

    - by hollyb
    I'm using a bit of jQuery to expand/hide some divs. I need to add an event handler so that when a link is clicked, it opens a corrisponding div. Each toggled div will have a unique class assigned to it. I am looking for some advice about how to build the event handler. The jQuery $(document).ready(function(){ $(".toggle_container:not(:first)").hide(); $(".toggle_container:first").show(); $("h6.trigger:first").addClass("active"); $("h6.trigger").click(function(){ $(this).toggleClass("active"); $(this).next(".toggle_container").slideToggle(300); }); The css: // uses a background image with an on (+) and off (-) state stacked on top of each other h6.trigger { background: url(buttonBG.gif) no-repeat;height: 46px;line-height: 46px;width: 300px;font-size: 2em;font-weight: normal;} h6.trigger a {color: #fff;text-decoration: none; display: block;} h6.active {background-position: left bottom;} .toggle_container { overflow: hidden; } .toggle_container .block {padding: 20px;} The html has a list of links, such as: <a href="#">One</a> <a href="#">Two</a> and the coorisponding divs to open: <h6 class="trigger">Container one</h6> <div class="toggle_container"> div one </div> <h6 class="trigger">Container two</h6> <div class="toggle_container Open"> div one </div> As I mentioned, I will be assigning a unique class to facilitate this. Any advice? Thanks! To clarify, i'm looking for some advice to build an event handler to toggle open a specific div when a link is clicked from a different part of the page, from a nav for instance.

    Read the article

  • Modularizing web applications

    - by Matt
    Hey all, I was wondering how big companies tend to modularize components on their page. Facebook is a good example: There's a team working on Search that has its own CSS, javascript, html, etc.. There's a team working on the news feed that has its own CSS, javascript, html, etc... ... And the list goes on They cannot all be aware of what everyone is naming their div tags and whatnot, so what's the controller(?) doing to hook all these components in on the final page?? Note: This doesn't just apply to facebook - any company that has separate teams working on separate components has some logic that helps them out. EDIT: Thanks all for the responses, unfortunately I still haven't really found what I'm looking for - when you check out the source code (granted its minified), the divs have UIDs, my guess is that there is a compilation process that runs through and makes each of the components unique, renaming divs and css rules.. any ideas? EDIT 2: Thanks all for contributing your thoughts - the bounty went to the highest upvoted answer. The question was designed to be vague- I think it led to a really interesting discussion. As I improve my build process, I will contribute my own thoughts and experiences. Thanks all! Matt Mueller

    Read the article

  • jQuery sliding animation not working

    - by Jake Zeitz
    I have three divs stacked on each other but offset so that a part of each div is visible. When one of the bottom divs is clicked I want the top div to animate out and back into the stack at the bottom, then the div that is clicked will appear at the top. So far I only have the code for when the middle div is clicked, but I cannot get it to work properly. What am I doing wrong? (I also realize that the code I wrote is probably terrible, this is the first jQuery code I have written.) The css is very very simple: .first { z-index: 3; } .second { z-index: 2; } .third { z-index: 1; } The basic html is this: <div class="first"></div> <div class="second"></div> <div class="third"></div> Here is my code: $("div.second").click(function () { $("div.first").animate({ left: "-=200px"}, {duration: "fast", complete: function () { $("div.first").removeClass("first").addClass("third").animate({left: "+=350px", top: "+=60px"}, "fast"); } }); $("div.second").animate({ left: "-=24px", top: "-=30px"}, {duration: "fast", complete: function () { $("div.second").removeClass("second").addClass("first"); } }); $("div.third").animate({ left: "-=24px", top: "-=30px"}, {duration: "fast", complete: function () { $("div.third").removeClass("third").addClass("second"); } }); }); I can get the div.first to move to the side and back. But now I can't get the classes to stay changed. What keeps happening is the div.second will remove it's class and add .first in the animation, but when the animation is complete, it acts like it still has a class of .second.

    Read the article

  • Floated element not included in parent, causing margin-bottom problems

    - by Christian Mann
    Right, so I've got a section of a page: <div class="article"> <div class="author"> <img src="images/officers/john_q_public_thm.jpg" /> <span class="name">John Q. Public</span> <span class="position">President</span> </div> <abbr class="postdate"> <span class="month m-01">Jan</span> <span class="day d-31">31</span> <span class="year y-2009">2009</span> </abbr> <div class="content"> <h2 class="title">Article Title</h2> <p>Pellentesque habitant morbi...facilisis luctus, metus</p> <p>Pellentesque habitant morbi...facilisis luctus, metus</p> </div> </div> <div class="article">...</div> <div class="article">...</div> The author and abbr divs are floated to the left. Each one of these article divs needs to be separated from its siblings by 5px or so. However, the author div is extending beyond the technical "height" of the div. The margin-bottom is doing nothing, as the space is being taken up by the floated author. This is somewhat difficult to envision, so I've placed it on my web server Is there any way to force the parent to be at least as tall as all of the floated elements within? If anyone figures out what I'm saying, thanks.

    Read the article

  • ASPX page renders differently when reached on intranet vs. internet?

    - by MattSlay
    This is so odd to me.. I have IIS 5 running on XP and it's hosting a small ASP.Net app for our LAN that we can access by using the computer name, virtual directory, and page name (http://matt/smallapp/customers.aspx), but you can also hit that IIS server and page from the internet because I have a public IP that my firewall routes to the "Matt" computer (like http://213.202.3.88/smallapp/customers.aspx [just a made-up IP]). Don't worry, I have Windows domain authentication is in place to protect the app from anonymous users. So all the abovea parts works fine. But what's weird is that the Border of the divs on the page are rendered much thicker when you access the page from the intranet, versus the internet, (I'm using IE8) and also, some of the div layout (stretching and such) acts differently. Why would it render different in the same browser based on whether it was reached from the LAN vs. the internet? It does NOT do this in FireFox. So it must be just an IE8 thing. All the CSS for the divs is right in the HTML page, so I do not think it is a caching matter of a CSS file. Notice how the borders are different in these two images: Internet: http://twitpic.com/hxx91 . Lan: http://twitpic.com/hxxtv

    Read the article

  • Is it possible to guarantee a unique id for multiple items using the same id variable at a point in

    - by Scarface
    First of all, do not be overwhelmed by the long code, I just put it for reference...I have a function that preg_replaces content and puts it in a jquery dialog box with a matching open-link. For example, if there is a paragraph with two matches, they will be put inside two divs, and a jquery dialog function will be echoed twice; one for each div. While this works for one match, if there are multiple matches, it does not. I am not sure how to distribute unique ids at a point in time for each of the divs and matching dialog open-scripts. Keep in mind, I removed the preg replace function since it kind of complicates the problem. If anyone has any ideas, they will be greatly appreciated. <?php $id=uniqid(); $id2=uniqid(); echo "<div id=\"$id2\"> </div>"; ?> $.ui.dialog.defaults.bgiframe = true; $(function() { $("<?php echo"#$id2"; ?>").dialog({hide: 'clip', modal: true ,width: 600,height: 350,position: 'center', show: 'clip',stack: true,title: 'title', minHeight: 25, minWidth: 100, autoOpen: false}); $('<?php echo"#$id"; ?>').click(function() { $('<?php echo"#$id2"; ?>').dialog('open'); }) .hover( function(){ $(this).addClass("ui-state-hover"); }, function(){ $(this).removeClass("ui-state-hover"); } ).mousedown(function(){ $(this).addClass("ui-state-active"); }) .mouseup(function(){ $(this).removeClass("ui-state-active"); }); });

    Read the article

  • Dojo StackContainer children are not resizing on browser maximise/restore

    - by Andy
    Hi. I have the following nested layout in a dojo 1.4 app: BorderContainer 1 -- Stack Container 1 ----BorderContainer 2 ----BorderContainer 3 The StackContainer is sized with width and height 100%. When I resize the browser window using maximise/restore, the StackContainer correctly resizes to the center region of it's parent BorderContainer. The problem I have is that the StackContainer children (BorderContainer 2 and 3) do not get resized to the StackContainer's contentBox. Is there something special you have to do to force a resize of StackContainer children? I have tried calling StackContainer1.resize() but this makes no difference. Thanks in advance. Additional information: Thanks for the reply peller. The widget hierachy that contains the StackContainer is actually a custom widget, so the StackContainer is not actually in a BorderContainer directly, but has its height and width explicitly set to 100%. This works and the StackContainer is resized correctly on browser maximise. The direct children of the stackcontainer are BorderContainers and it is these BorderContainers that do not get resized when the StackContainer is resized. One point to note is that when the StackContainer is created in markup, the stackcontainer children are empty divs. These divs are then used as placeholders for custom widget creation, e.g. var widget = new com.company.widget(params, placeholderDiv); where placeholderDiv is a direct child of the StackContainer in markup. Should I be adding the programatically created 'widget' to the stackcontainer using addChild instead?

    Read the article

  • How to paginate json data?

    - by Pandiya Chendur
    I used json data and iterated div elements to get my result.... function Iteratejsondata(HfJsonValue) { //var jsonObj = eval('(' + HfJsonValue + ')'); var jsonObj = JSON.parse(HfJsonValue); for (var i = jsonObj.Table.length - 1; i >= 0; i--) { var employee = jsonObj.Table[i]; $('<div class="resultsdiv"><br /><span class="resultName">' + employee.Emp_Name + '</span><span class="resultfields" style="padding-left:100px;">Category&nbsp;:</span>&nbsp;<span class="resultfieldvalues">' + employee.Desig_Name + '</span><br /><br /><span id="SalaryBasis" class="resultfields">Salary Basis&nbsp;:</span>&nbsp;<span class="resultfieldvalues">' + employee.SalaryBasis + '</span><span class="resultfields" style="padding-left:25px;">Salary&nbsp;:</span>&nbsp;<span class="resultfieldvalues">' + employee.FixedSalary + '</span><span style="font-size:110%;font-weight:bolder;padding-left:25px;">Address&nbsp;:</span>&nbsp;<span class="resultfieldvalues">' + employee.Address + '</span></div>').insertAfter('#ResultsDiv'); } $(".resultsdiv:even").addClass("resultseven"); $(".resultsdiv").hover(function() { $(this).addClass("resultshover"); }, function() { $(this).removeClass("resultshover"); }); } I get 22 records in total... Now i want to paginate these divs (i.e) 5 divs per page... Any suggestion...

    Read the article

< Previous Page | 15 16 17 18 19 20 21 22 23 24 25 26  | Next Page >