Search Results

Search found 4015 results on 161 pages for 'bill li'.

Page 44/161 | < Previous Page | 40 41 42 43 44 45 46 47 48 49 50 51  | Next Page >

  • Getting proper indentation using XMLBuilder in a helper

    - by Robbie
    I'm attempting to use a view helper to create some dynamic links based on if you're logged in or not. What I want returned, for sake of easy code readability, is: <ul class="right"> <li><a href="#">Login</a></li> <li><a href="#">Register</a></li> </ul> In the view helper I have this Ruby code: def loginh xm = Builder::XmlMarkup.new(:indent=>2, :margin=>4) xm.ul("class" => "right") { xm.li('class' => 'text') { xm.text("test") } } end In the view, the line that calls login helper is already indented 4 levels. Because of this, the first line gets 'skewed', so in the view I have: <%= loginh %> Which results in: <ul class="right"> <li class="text"> <text>test</text> </li> </ul> You can see it works perfectly, except for the first line. It would appear that the first line is affected by the indent before <%= loginh % is called. I can easily remedy this by removing the indentation prior to <%= loginh % - but in essence I'd be sacrificing code readability for markup readability. Which isn't what I'm looking to do. Is there any way I could remove the beginning whitespace?

    Read the article

  • Recursive list of lists in XSL

    - by Paul Tomblin
    I have a recursive nodes that I'm trying to set up for jquery-checktree. The nodes look like foo/bar/ID /NAME /CHECKED bar/ID /NAME /CHECKED /bar/ID /NAME /bar/ID /NAME /bar/ID /NAME /CHECKED /bar/ID /NAME /CHECKED Where any bar may or may not have one or more bar nodes below it, but any bar will have ID and NAME and might have a CHECKED. and I want to turn that into <ul> <li><input type="checkbox" name="..." value="..." checked="checked"></input> <label for="...">...</label> <ul> <li><input type="checkbox" name="..." value="..." checked="checked"></input> <label for="...">...</label> </li> </ul> <li>....</li> </ul> I can get the first level by doing: <ul class="tree"> <xsl:for-each select="/foo/bar/"> <li><input type="checkbox" name="{ID}" value="{ID}"> <xsl:if test="CHECKED = 'Y'"><xsl:attribute name="checked">checked</xsl:attribute></xsl:if> </input><label for="{ID}"><xsl:value-of select="NAME"/></label> </li> </xsl:for-each> </ul> But I don't know how to recurse down to the embedded "bar" within the "bar", down to however many levels there might be.

    Read the article

  • jQuery slideDown: Parent element doesn't expand?

    - by bobsoap
    Hi, This issue occurs in our beloved Internet Explorer 7: I have a list of items, each with a hidden child div. When user clicks the "expand" button in any list item, the hidden div will expand downwards and push all content beneith it lower. This works just as it should in FF, Chrome, IE8 - but IE7 will not expand the parent element along with its children. This is noticeable because the top-most parent container has an absolutely positioned image at the very bottom (yea... rounded corners) - that doesn't get pushed down when the content expands. I'm guessing that's because of the absolute positioning... Just wondering whether I should attempt to code up some huge workaround in jQuery just for that (assuming I'm able to), or if this is a known issue of some sort. My HTML: <div id="container"> <ul> <li>Click here to expand <div class="hide"></div> </li> <li>Click here to expand <div class="hide"></div> </li> <li>Click here to expand <div class="hide"></div> </li> </ul> <div id="containerbottom"></div> </div> The CSS: #container { position:relative; } #container #containerbottom { position:absolute; bottom:0px; left:0px; } The jQuery is pretty much your everyday slide function: $('ul li').click(function() { $(this).children('.hide').slideDown(200); }); Any ideas?

    Read the article

  • Drupal6: How to programmatically style a block?

    - by Fronker
    In Drupal6, I basically have a block (a hierarchical menu structure) that turns out like this in HTML: <div class="block block-menu_block" id="block-menu_block-1"> <div class="content"> <div class="menu-block-1 menu-name-menu-navigation parent-mlid-0 menu-level-1"> <ul class="menu"> <li class="leaf first menu-mlid-248 active active-trail"><a class="active-trail active" title="" href="/">Start</a></li> <li class="expanded menu-mlid-249 active"><a class="active" title="" href="/">Aktuell</a> <ul class="menu"> <li class="leaf first menu-mlid-259"> <a title="News und Presse" href="/news-und-presse">News and Press</a> </li>... What I would like to get is actually a lot simpler: <div id="topmenu"> <ul class="one"> <li>some main entry <ul> <li> some sub entry ... or maybe: <div id="topmenu"> <h2>some main entry</h2> <h3><a href="#">some sub entry</a></h3> <h3><a href="#">another sub entry</a></h3> <h2>another main entry</h2> So, keeping the structure, but being able to use simpler, even completely different tags, if and when needed. I think I understand from the drupal docs, that I am (maybe) looking at <div class="block block-menu_block" id="block-menu_block-1" ==> module := menu_block delta := 1 (?) regrettably, none of the suggested * block-[module]-[delta].tpl.php * block-[module].tpl.php * block-[region].tpl.php placed next to page.tpl.php has any impact (yes, I did clear the cache).

    Read the article

  • jquery keypress iterate through each loop?

    - by user239831
    hey guys, probably a simpel question, however couldn't find anything online. i have a list with search results and i want to be able to navigate through the list with my up and down keys. if (e.keyCode == 40) { //down //alert('down'); $('#searchresults ul li').each(function() { }); } if (e.keyCode == 38) { //up //alert('up'); } if (e.keyCode == 13) { //enter //alert('enter'); } the searchresults look like this: <ul> <li class="matched"><a href="link1">link1</a></li> <li class="matched"><a href="link2">link2</a></li> <li class="matched"><a href="link3">link3</a></li> </ul> So basically i just want to be able to navigate through my searchresults with the up and down keys. the selection of the current element should maybe just change the background color and when i press enter the linked and matched element is fired. any idea how i can iterate through the searchresults? thank you

    Read the article

  • Presentation Issue in an Unordered List

    - by phreeskier
    I'm having an issue with correctly presenting items in an unordered list. The labels are floating left and the related spans that are long in length are wrapping and showing below the label. I need a solution that keeps the related spans in their respective columns. In other words, I don't want long spans to show under the labels. What property can I take advantage of so that I get the desired layout in all of the popular browsers, including IE6? Thanks in advance for the help. My code is as follows: <ul> <li> <label>Name</label> <span><%= Html.Encode(Model.Name) %></span> </li> <li> <label>Entity</label> <span><%= Html.Encode(Model.Entity) %></span> </li> <li> <label>Phone</label> <span><%= Html.Encode(Model.Phone) %></span> </li> </ul> My CSS styling is as follows: ul { display:block; list-style-type:none; margin:0; padding:0; } ul li label { float:left; width:100px; }

    Read the article

  • jQuery image fader slow in IE6 & 7

    - by Jamie
    Hi guys, I'm using the following jQuery script to rotate through a series of images pulled into an unordered list using PHP: function theRotator() { $('#rotator li').css({opacity: 0.0}); $('#rotator li:first').css({opacity: 1.0}); setInterval('rotate()',5000); }; function rotate() { var current = ($('#rotator li.show') ? $('#rotator li.show') : $('#rotator li:first')); var next = ((current.next().length) ? ((current.next().hasClass('show')) ? $('#rotator li:first') :current.next()) : $('#rotator li:first')); next.css({opacity: 0.0}).addClass('show').animate({opacity: 1.0}, 2000); current.animate({opacity: 0.0}, 2000).removeClass('show'); }; $(document).ready(function() { theRotator(); }); It works brilliantly in FF, Safari, Chrome and even IE8 but IE6 & 7 are really slow. Can anyone make any suggestions on making it more efficient or just work better in IE6 & 7? The script is from here btw. Thanks.

    Read the article

  • How add class='active' to html menu with php

    - by meow
    Hello I want to put my html navigation in a separate php file so when I need to edit it, I only have to edit it once. The problem starts when I want to add the class active to the active page. I've got three pages and one common file. common.php : <?php $nav = <<<EOD <div id="nav"> <ul> <li><a <? if($page == 'one'): ?> class="active"<? endif ?> href="index.php">Tab1</a>/</li> <li><a href="two.php">Tab2</a></li> <li><a href="three.php">Tab3</a></li> </ul> </div> EOD; ?> index.php : All three pages are identical except their $page is different on each page. <?php $page = 'one'; require_once('common.php'); ?> <html> <head></head> <body> <?php echo $nav; ?> </body> </html> This simply won't work unless I put my nav on each page, but then the whole purpose of separating the nav from all pages is ruined. Is what I want to accomplish even possible? What am I doing wrong? Thanks EDIT: When doing this, the php code inside the li don't seem to run, it's just being printed as if it was html

    Read the article

  • Clearing block affects wrong floating

    - by HiveHicks
    I've got two-column layout <div class="left-pane"> Left pane </div> <div class="central-pane"> <div> <ul class="customers-types-tabs"> <li>item 1</li> <li>item 2</li> <li>item 3</li> </ul> </div> <div>Main content</div> </div> and the stylesheet: .left-pane { width: 248px; float: left; background-color: #f6f6f6; border: 1px solid #e6e6e6; padding: 20px 5px; } .central-pane { margin-left: 270px; } .customers-types-tabs li { background-color: #f6f6f6; border: 1px solid #d5d5d5; line-height: 38px; padding: 0 20px; float: left; margin-right: 10px; position: relative; top: 1px; } The problem is that I want "Main content" to appear right below the div with ul inside it (that represents tabs control), but if I set Main content's div's style to clear: both, it appears below the left pane, which is taller than the ul. What should I do to get correct position of main content?

    Read the article

  • JQuery Bind click event to appended element with an argument

    - by Gabor Szauer
    Hi guys, I'm trying to populate a ul list with some li elements and give each li element a link that calls the same function with a different argument. However it doesn't seem to work, i've attached the code below, CheckForNewMail is called on document load. Can anyone please help me out? function CheckForNewMail() { ////////////////////////////////////////////////////////////////// // This will be dynamic MailInInbox[0] = new Array("0", "Mail One"); MailInInbox[1] = new Array("12", "Mail Two"); MailInInbox[2] = new Array("32", "Mail Three"); MailInInbox[3] = new Array("5", "Mail Four"); ////////////////////////////////////////////////////////////////////// $('#mail-in-inbox').children().remove(); size = 4; element = $('#mail-in-inbox'); for(i = 0; i < size; ++i) { var link = $('<a href="#" class="inbox-link">'+ MailInInbox[i][1] +'</a>'); link.live('click', function() { LoadMailById(i); }); li = $('<li></li>'); li.append(link); element.append(li); } } function LoadMailById(id) { alert("Button "+ id +" clicked!"); }

    Read the article

  • Fancy Box to Popup an HTML Page from One List Item in an Unordered List

    - by nicorellius
    I have an unordered list: <ul> <li><a id="fancy_popup" href="popup.html" class="fancybox"> Popup HTML Link</a></li> <li><a href="other.html">Other HTML Link</a></li> <li><a href="other.html">Other HTML Link</a></li> </ul> And I have a jQuery script: <script type="text/javascript"> $(document).ready(function() { $("#fancy_popup").fancybox({ transitionIn : 'elastic', transitionOut : 'elastic', easingIn : 'easeInSine', easingOut : 'easeOutSine', speedIn : 400, speedOut : 200, titlePosition : 'inside', titleFormat : 'document.write("Fancy Box Title");', cyclic : true }); }); </script> This jQuery Fancy Box script works elsewhere, with a div that has the id="fancy_popup" so I thought why not add it to the anchor directly in this case... I'm trying to figure out how to apply Fancy Box so that when someone clicks the Popup HTML link above, a Fancy Box window pops up, according to the script. I've tried variations with placing the id on the li, on the ul and manipulating the script for these selectors to no avail. Any help is appreciated.

    Read the article

  • Is there a way to check if a div has the same class as an ancestor in jQuery?

    - by T.R.
    I'm looking to dynamically highlight a tab, if it represents the current page. I have: <style> #tabs li{bg-color: white;} body.Page1 #tabs .Page1, body.Page2 #tabs .Page2, body.Page3 #tabs .Page3{bg-color: orange;} </style> <body class="Page1 ADifferentClass"> <ul id="tabs"> <li class="Page1 SomeClass"> <li class="Page2 SomeOtherClass"> <li class="Page3 AnotherClass"> </ul> </body> As you can see, there needs to be CSS for each tab, so adding another page involves modifying both the HTML and the CSS. Is there a simple (DRY) way to check if two divs have the same class already built into jQuery? I ultimately went with this: <script> $(document).ready(function(){ var classRE = /Page\d+/i; var pageType = $('body').attr('className').match(classRE); $('li.'+pageType).addClass('Highlight'); }); </script> <style> #tabs li{bg-color: white;} #tabs li.Highlight{bg-color: orange;} </style>

    Read the article

  • CSS to create curved corner between two elements?

    - by Tauren
    My UI has an unordered list on the left. When a list item is selected, a div appears on the right of it. I'd like to have a curved outer corner where the <li> and the <div> meet. See the white arrow in the image below. To extend the blue <li> to the edge of the <ul>, I'm planning to do something like this: li { right-margin: 2em; border-radius: 8px; } li.active { right-margin: 0; border-bottom-right-radius: 0; border-top-right-radius: 0; } Is there a better way to extend the <li> to the edge of the <ul>? Obviously, I'll include the webkit and mozilla border radius CSS as well. The main thing I'm unsure about is that outer corner underneath the bottom right corner of the active <li>. I have some ideas, but they seem like hacks. Any suggestions? NOTE that the <ul> is indicated in grey, but it would be white in the real design. Also, I'm planning to use Javascript to position the <div> correctly when an <li> is selected.

    Read the article

  • Using innerHTML to add ordered list fails in IE

    - by Matt
    I'm using the following Javascript code to populate a DIV with an ordered list: // send script back in split list var scriptList = script.split("\n"); var finalScript = "<ol>\n"; var count = 0; while(scriptList.length >= count) { if((scriptList[count]=="") || (scriptList[count] == undefined)) { count ++; continue; } finalScript = finalScript + "<li>" + scriptList[count] + "</li>\n"; count ++; } finalScript = finalScript + "</ol>"; scriptingDiv.innerHTML = finalScript; In firefox, if i look in the DOM using Firebug, this correctly translates to the following and correctly displays an ordered list. <ol> <li>This is the first item in the list</li> <li>This is the second item in the list</li> </ol> In IE, it displays as if the </li> tags are <br /> tags and ignores all the other tags, like this: This is the first item in the list This is the second item in the list Do I need to dynamically add the ordered list to the DOM for this to work? As opposed to just setting the html code in the div using .innerHTML? TIA

    Read the article

  • Showing multiple elements onClick

    - by Nimbuz
    HTML: <ul id="mode"> <li><a href="#tab1">tab1</a> <div class="extra">tada</div> </li> <li><a href="#tab2">tab2</a> <div class="extra">tada</div> </li> </ul> <div id="tab1" class="tab-content" style="display: none">content 1</div> <div id="tab2" class="tab-content" style="display: none">content 2</div> ? jQuery: $(function(){ var mode = $('#mode'); var arrow = $('<span/>', {'class': 'arrow'}); $('li a', mode).bind('click.mytabs', function() { $('li', mode).removeClass('active'); $(this).parent().addClass('active').append(arrow); var a = $(this).attr('href'); $('.tab-content').hide(); $(a).show(); return false; }).filter(':first').triggerHandler('click.mytabs'); // eq(0) works as well }); JSFiddle here: http://jsfiddle.net/wwMJL/ I'd like to also show each li's 'extra' div on click and hide when the tab is inactive, what do I need to change in the code? Thanks!

    Read the article

  • Div appearing outside its parent, bizarre sizing problems...

    - by SLC
    I have a list, which is going to be a menu. I want to position it absolutely at the very top of the page. My code looks like this: <div id="sitenavmenu"> <div id="sitenavmenu-content"> <ul id="sitenavmenu-content-menu"> <li>Register</li> <li><%: Html.ActionLink("About", "About", "Home")%></li> <li>Contact Us</li> </ul> </div> </div> My CSS looks like this: #sitenavmenu { position:absolute; margin-left:300px; top:2px; width:500px; } #sitenavmenu-content-menu li { list-style-type:none; display:inline; padding-right:5px; font-size:small; } The problem I have is, if I don't position it absolutely, it looks fine. As soon as I position it absolutely (as it is shown above), the sitenavmenu div changes size, and although it shifts to the top, the sitenavmenu-content div appears below it. There is no other CSS as I have only just started, and I have checked padding etc. and everything is zero. I just can't figure out why it's not working, and I don't want to hack it. Edit: It's something to do with the height of #sitenavmenu. If I leave it, then the sitenav-content ends up horizontally centered in it, although #sitenavmenu is much taller. If I make them both the same size, so they should sit on top of each other, then the #sitenavmenu-content sits below.

    Read the article

  • get an id of child element and store in a variable using jquery?

    - by Simpson88Keys
    I'm basically trying to do exactly what the subject suggests, but I'm getting "undefined" in my alert, and I'm not entirely sure why. I am fairly new to jquery, so, I probably have the syntax wrong, but not sure where to go from here. I'll post both of my attempts, which both yield "undefined" in the alert... //In my first attempt, I'm trying to get the id of the inner a tag <ul> <li id="l1" class="active"><a href="#c1">Samp 1</a></li> <li id="l2" class=""><a href="#c2">Samp 2</a></li> <li id="l3" class=""><a href="#c3">Samp 3</a></li> </ul> var selected = $(".active).children("a").attr("id"); alert(selected); //In my second attempt, I'm trying to get the id of the currently selected li var selected = $(".active").attr("id"); alert(selected);

    Read the article

  • CSS refuse to obey

    - by Frank
    Hi, I'll make this short, I got this webpage : <html xmlns="http://www.w3.org/1999/xhtml"> <head> <link rel="Stylesheet" type="text/css" href="css/style.css" /> <link rel="Stylesheet" type="text/css" href="css/nav.css" /> </head> <body> <div id="header"> <ul id="navList"> <li><a href="#" id="navActive">foo</a></li> <li><a href="#">bar</a></li> </ul> </div> </body> </html> With this CSS style.css body { padding:0; margin:0; background-color:#000000; background-repeat:no-repeat; background-image:url('../img/bg.jpg'); } nav.css #navList { padding:0; margin:0; background-image:url('../img/menu.png'); list-style-type:none; padding:12px 150px; } #navList li { display:inline; } #navList li a { color:#bfbfbf; padding:14px 25px; text-decoration:none; } #navList li a:hover { color:#000000; background-color:#bfbfbf; text-decoration:none; } #navActive { color:#000000; background-color:#bfbfbf; } It looks like the CSS from the navActive id is never being applied... Could someone tell me why and/or suggest me a way to correct this. Thanks.

    Read the article

  • Big task - problems with page refresh and ajax

    - by user1830414
    I have a navigation which load dynamically content via ajax. But if I refresh the page or visit another url and go back the current content is away and I see the old content under the first menu tab. Now I have to solve this problem. The index.php include the elements header_registrated.inc.php, navigation.inc.php and main_container.inc.php index.php: <?php include("inc/incfiles/header_registrated.inc.php"); ?> <?php if (!isset($_SESSION["userLogin"])) { echo "<meta http-equiv=\"refresh\" content=\"0; url=http://localhost/project\">"; } else { echo ""; } ?> <?php include("inc/incfiles/navigation.inc.php"); ?> <?php include("inc/incfiles/main_container.inc.php"); ?> <?php include("inc/incfiles/footer.inc.php"); ?> header_registrated.inc.php: <?php include ("inc/scripts/mysql_connect.inc.php"); session_start(); $user = $_SESSION["userLogin"]; ?> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>title</title> <link href="css/style.css" rel="stylesheet" type="text/css" /> <script language="JavaScript" src="js/framework/jquery.js"></script> <script language="JavaScript" src="js/dropdown/window.js"></script> <script language="JavaScript" src="js/navigation/navigation.js"></script> </head> <body> </body> navigation.inc.php: <div class="navigation"> <ul> <li id="1"> <div id="menuImage1" class="menuImage"></div> <div class="menuText"><p>Punkt 1</p></div> <div class="navigationDart"></div> </li> <li id="2"> <div id="menuImage2" class="menuImage"></div> <div class="menuText"><p>Punkt 2</p></div> </li> <li id="3"> <div id="menuImage3" class="menuImage"></div> <div class="menuText"><p>Punkt 3</p></div> </li> <li id="4"> <div id="menuImage4" class="menuImage"></div> <div class="menuText"><p>Punkt 4</p></div> </li> <li id="5"> <div id="menuImage5" class="menuImage"></div> <div class="menuText"><p>Punkt 5</p></div> </li> <li id="6"> <div id="menuImage6" class="menuImage"></div> <div class="menuText"><p>Punkt 6</p></div> </li> </ul> </div> main_container.inc.php: <div class="mainContainer"> <div class="containerHeader"> <div class="contentHeader"> </div> </div> <div class="contentContainer"> <div class="content"> </div> <div class="advertisement"> </div> </div> </div> Now the divs content, cnotentHeader and advertisement (in file main_content.inc.php) is filled via ajax. Also the navigation has some jquery effects which also have to be the same after page refresh. navigation.js: $(document).ready(function() { $.get('inc/incfiles/content_container/header/1.php', function(data) { $('.contentHeader').html(data); }); $.get('inc/incfiles/content_container/content/1.php', function(data) { $('.content').html(data); }); $.get('inc/incfiles/content_container/advertisement/1.php', function(data) { $('.advertisement').html(data); }); var current = '1.php'; $(".navigation li").click(function() { var quelle = $(this).attr('id') + ".php"; // the current content doesn't load again if(current === quelle) { return; } current = quelle; // content $(".content").fadeOut(function() { $(this).load("inc/incfiles/content_container/content/" + quelle).fadeIn('normal'); }) // advertisement $(".advertisement").fadeOut(function() { $(this).load("inc/incfiles/content_container/advertisement/" + quelle).fadeIn('normal'); }) // header $(".contentHeader").fadeOut(function() { $(this).load("inc/incfiles/content_container/header/" + quelle).fadeIn('normal'); }) }); $(".navigation li").click(function() { $(".menuImage").removeClass("menuImageActive1"); $(".menuImage").removeClass("menuImageActive2"); $(".menuImage").removeClass("menuImageActive3"); $(".menuImage").removeClass("menuImageActive4"); $(".menuImage").removeClass("menuImageActive5"); $(".menuImage").removeClass("menuImageActive6"); }); $("#1").mousedown(function() { $("#menuImage1").addClass("menuImageClick1"); // new class on mouse button press }); $("#1").mouseup(function() { $("#menuImage1").removeClass("menuImageClick1"); //remove class after mouse button release }); $("#1").click(function() { $("#menuImage1").addClass("menuImageActive1"); }); $("#2").mousedown(function() { $("#menuImage2").addClass("menuImageClick2"); // new class on mouse button press }); $("#2").mouseup(function() { $("#menuImage2").removeClass("menuImageClick2"); //remove class after mouse button release }); $("#2").click(function() { $("#menuImage2").addClass("menuImageActive2"); }); $("#3").mousedown(function() { $("#menuImage3").addClass("menuImageClick3"); // new class on mouse button press }); $("#3").mouseup(function() { $("#menuImage3").removeClass("menuImageClick3"); //remove class after mouse button release }); $("#3").click(function() { $("#menuImage3").addClass("menuImageActive3"); }); $("#4").mousedown(function() { $("#menuImage4").addClass("menuImageClick4"); // new class on mouse button press }); $("#4").mouseup(function() { $("#menuImage4").removeClass("menuImageClick4"); //remove class after mouse button release }); $("#4").click(function() { $("#menuImage4").addClass("menuImageActive4"); }); $("#5").mousedown(function() { $("#menuImage5").addClass("menuImageClick5"); // new class on mouse button press }); $("#5").mouseup(function() { $("#menuImage5").removeClass("menuImageClick5"); //remove class after mouse button release }); $("#5").click(function() { $("#menuImage5").addClass("menuImageActive5"); }); $("#6").mousedown(function() { $("#menuImage6").addClass("menuImageClick6"); // new class on mouse button press }); $("#6").mouseup(function() { $("#menuImage6").removeClass("menuImageClick6"); //remove class after mouse button release }); $("#6").click(function() { $("#menuImage6").addClass("menuImageActive6"); }); $("#1").click(function(){ $(".navigationDart").animate({ top: "16px" }, 500 ); }); $("#2").click(function(){ $(".navigationDart").animate({ top: "88px" }, 500 ); }); $("#3").click(function(){ $(".navigationDart").animate({ top: "160px" }, 500 ); }); $("#4").click(function(){ $(".navigationDart").animate({ top: "232px" }, 500 ); }); $("#5").click(function(){ $(".navigationDart").animate({ top: "304px" }, 500 ); }); $("#6").click(function(){ $(".navigationDart").animate({ top: "376px" }, 500 ); }); }); My idea was it to work with if(isset($_SESSION['ajaxresponse'])) but I don't no how to do this. Please help me. I have the feeling that I've searched the whole web to find an answer.

    Read the article

  • Override one css class with another?

    - by user246114
    Hi, I have a list, with an li style defined. I want to replace the style of an individual element, but it doesn't seem to have any visual effect. Example: .myList li { background-color: yellow; } .foo { background-color: green; } <ul class='myList'> <li>Hello</li> </ul> When I add an item to the list, it has the .myList li style applied properly. I try now to remove all styles and apply the foo style to a single item (using jquery): $(item).removeClass(); $(item).addClass("foo"); the item does not change color to green though, but this reports the class is set to 'foo': alert($(item).attr('class')); so I guess I'm not understanding css rules here, looks like the li class definition is just overriding whatever else I do, however I want the reverse to be true, I want to override the li style definition with foo. How do we do this? Thanks

    Read the article

  • How to use vertical-align: middle; properly?

    - by Andrew
    I want to have my list (nav) align to the center of an image (logo). I tried using vertical-align: middle;, but I couldn't get it to work when I floated the images left and right. Here's my code: HTML: <div id="head"> <img id="logo" src="logo.png" /> <ul id="nav"> <li><a href="#">Item 1</a></li> <li><a href="#">Item 2</a></li> <li><a href="#">Item 3</a></li> </ul> </div> CSS: #head { margin-top: 2px; width: 100%; } #logo { float: left; } ul#nav { float: right; } ul#nav li { display: inline; list-style-type: none; } I took all the vertical-align: middle;'s from where I put them (I tested it in each element, even though it was only supposed to be applied to #logo, from what I've read.) Anyways, any help would be appreciated.

    Read the article

  • Bind event to AJAX populated list items

    - by AnPel
    I have an unordered list with no list items. I get some information from the user, I run it through my database using AJAX and the servers sends back a JSON object response. Then I append each list item I want to display to the list using something like $('blabla').append('<li>information</li>') My question is, since the li elements were not there at the time the DOM was ready, how can I bind a click event to them? Here is my full code: $(function(){ var timer; $('#f').keyup(function(){ clearTimeout(timer); timer = setTimeout(getSuggestions, 400); }); }) function getSuggestions(){ var a = $('#f')[0].value.length; if( a < 3){ if(a == 0){ $('#ajaxerror').hide(300,function(){ $('#loading').hide(300,function(){ $('#suggest').hide(300) }) }) } return; } $('#loading').slideDown(200,function(){ $.ajax({ url: '/models/AJAX/suggest.php', dataType: 'json', data: {'data' : $('#f')[0].value }, success: function(response){ $('#ajaxerror').hide(0,function(){ $('#loading').hide(100,function(){ $('#suggest ul li').remove(); for(var b = 0; b < ( response.rows * 3); b = b + 3){ $('#suggest ul').append('<li>'+response[b]+' '+response[b+1]+' '+response[b+2]+'</li>') // MISSING SOME CODE HERE TO BIND CLICK EVENT TO NEWLY CREATED LI } $('#suggest').show(300) }) }) }, error: function(){ $('#suggest').hide(0,function(){ $('#loading').slideUp(100,function(){ $('#ajaxerror').show(300) }) }) } }) }) }

    Read the article

  • Why my :hover aren't working?

    - by user1628488
    I have am nav, and when i hover some elements, the submenu should be displayed 'block', but this dont work. See <!doctype html> <html lang="pt-br"> <head> <meta charset="utf-8" /> <meta name="robots" content="noindex, nofollow" /> <meta name="generator" content="Notepad++" /> <meta name="author" content="Erick Ribeiro" /> <meta http-equiv="refresh" content="60" /> <title>Mozilla Firefox</title> <style type="text/css"> *{ font-family: calibri; } #menu { float: left; } .submenu { margin-top: 26px; padding: 10px; border: solid 1px rgb(224, 224, 224); background: rgb(254, 254, 254); color: rgb(0, 128, 224); border-radius: 0 0 4px 4px; } #menuHome:hover ~ #submenuControle { display: block; opacity: 0; color: red; } #submenuHome { display: none; opacity: 0; } #submenuControle { display: block; opacity: 1; } #submenuGestão { display: none; opacity: 0; } #submenuRL { display: none; opacity: 0; } #submenuSI { display: none; opacity: 0; } ul { float: left; list-style-type: none; padding: 0; margin: 0; } li { display: inline; float:left; } .primeiroItem { border: solid rgb(224, 224, 224); border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-radius: 4px 0 0 4px; } .naoPrimeiroItem { border: solid rgb(224, 224, 224); border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 0; } .ultimoItem { border: solid rgb(224, 224, 224); border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 0; border-radius: 0 4px 4px 0; } a { text-decoration:none; padding: 8px; border: solid 1px; color: rgb(0, 0, 0); background: rgb(240,240, 240); } a:visited { color: rgb(0, 0, 0); } </style> <script type="text/javascript"> </script> </head> <body> <nav id="menu"> <ul> <li><a id="menuHome" class="primeiroItem" href="#">Home</a></li> <li><a id="menuControle" class="naoPrimeiroItem" href="#">Controle</a></li> <li><a id="menuGestao" class="naoPrimeiroItem" href="#">Gestão</a></li> <li><a id="menuRL" class="naoPrimeiroItem" href="#">Relatórios e Listas</a></li> <li><a id="menuSI" class="ultimoItem" href="#">Sistema Informação</a></li> </ul> <div id="submenuHome" class="submenu"> </div> <div id="submenuControle" class="submenu"> BSC Comunicação Treinamento Documentos Controle de Acesso </div> <div id="submenuGestão" class="submenu"> ASV Treinamento Suprimentos Chamados</div> <div id="submenuRL" class="submenu"> Listas Relatórios </div> <div id="submenuSI" class="submenu"> </div> </nav> </body> </html>

    Read the article

  • Nested <a> and <span> challenge

    - by PaddyO
    Hi all, Trying in vain to get a nested link working within a nested span. This is a working test page for the code below to explain what I'm trying to do. Any ideas on how to get this working in valid html? I guess it's either a nesting order or style syntax thing but I am at a loss. Any thoughts much appreciated. <div id="greyback"> <ul id="scrollbox"> <li class="listcat">List header</li> <li><a class="menu" href="#freeze">List item 1<span><b>This text has popped up because you have clicked the list item, which has an "a" tag and now has :focus. That "a" tag is the first of two.</b><br><br>What I am trying to do is to set the second "a" tag as a DIFFERENT "embedded" link in this box<span style="color: blue; background-color: yellow;">eg, here<a href="http://www.conservationenterprises.com" target="blank">This is the second (nested) "a" tag in this html nest. It is a link to an external site. Instead of this being an always-visible link, I want it to sit within the yellow box in the first span (click the List item 1 to display).</a></span> </a></span> </li> </a></span> </li> </ul> </div> and the CSS: #scrollbox {margin: 0 auto; margin-top: 1em; margin-bottom: 1em; width:19em; height:auto; max-height: 21em; overflow:auto; border-bottom: 0.1em solid #FFA500; border-top: 0.1em solid #FFA500;} #scrollbox a {float: left; color:#000000; text-decoration:none; width:18em; height: auto; margin-bottom: 0.5em; font-family: Arial, sans-serif; font-size: 0.9em; text-align:left;} #scrollbox a.menu {} #scrollbox a span {display:none; position:absolute; left:0em; top:0;} #scrollbox a span img {float: right; border:0; max-width:7.5em;} #scrollbox a:hover {border: 0; color: #7ebb11; font-size:0.9em;} #scrollbox a:hover span {border: 0; color: #535353;} #scrollbox a span:focus {color: blue;} #scrollbox a:active {border:none; color: #535353; text-decoration: none;} #scrollbox a:focus {border:0em solid #000; outline:0;} #scrollbox a:active span, #scrollbox li a:active span, #scrollbox a:focus span, #scrollbox li a:focus span {display: block; width: 52.5em; min-height: 20em; height: auto; left: 1.5em; top:18em; z-index:10; font-size:0.9em; text-align: left; padding: 1em; padding-bottom: 0em; background-color: #c3FFe3; color: #535353; border: solid #FFA500 0.25em;} #scrollbox li a:active span span, #scrollbox li a:focus span span{display: block; width: auto; height: auto; min-height: 2em; left: 25em; top:10em; z-index:10; font-size:0.9em; text-align: left; padding: 1em; padding-bottom: 0em; background-color: transparent; color: #535353; border: dashed red 1px;} .ul#scrollbox {padding-left: 0.1em;} #scrollbox li {float:left; list-style: none; background: url(blank.png) no-repeat left center; margin-left: 0em; font-family:Arial, sans-serif; font-size: 0.9em;} #scrollbox li.listcat {float: left; text-align:left; width: 18em; margin-left: 0em; margin-top: 0.1em; margin-bottom: 0.3em; padding-top:0.5em; color: green; font-size: 0.9em; font-weight:bold;} Cheers Patrick.

    Read the article

  • Guidance: A Branching strategy for Scrum Teams

    - by Martin Hinshelwood
    Having a good branching strategy will save your bacon, or at least your code. Be careful when deviating from your branching strategy because if you do, you may be worse off than when you started! This is one possible branching strategy for Scrum teams and I will not be going in depth with Scrum but you can find out more about Scrum by reading the Scrum Guide and you can even assess your Scrum knowledge by having a go at the Scrum Open Assessment. You can also read SSW’s Rules to Better Scrum using TFS which have been developed during our own Scrum implementations. Acknowledgements Bill Heys – Bill offered some good feedback on this post and helped soften the language. Note: Bill is a VS ALM Ranger and co-wrote the Branching Guidance for TFS 2010 Willy-Peter Schaub – Willy-Peter is an ex Visual Studio ALM MVP turned blue badge and has been involved in most of the guidance including the Branching Guidance for TFS 2010 Chris Birmele – Chris wrote some of the early TFS Branching and Merging Guidance. Dr Paul Neumeyer, Ph.D Parallel Processes, ScrumMaster and SSW Solution Architect – Paul wanted to have feature branches coming from the release branch as well. We agreed that this is really a spin-off that needs own project, backlog, budget and Team. Scenario: A product is developed RTM 1.0 is released and gets great sales.  Extra features are demanded but the new version will have double to price to pay to recover costs, work is approved by the guys with budget and a few sprints later RTM 2.0 is released.  Sales a very low due to the pricing strategy. There are lots of clients on RTM 1.0 calling out for patches. As I keep getting Reverse Integration and Forward Integration mixed up and Bill keeps slapping my wrists I thought I should have a reminder: You still seemed to use reverse and/or forward integration in the wrong context. I would recommend reviewing your document at the end to ensure that it agrees with the common understanding of these terms merge (forward integration) from parent to child (same direction as the branch), and merge  (reverse integration) from child to parent (the reverse direction of the branch). - one of my many slaps on the wrist from Bill Heys.   As I mentioned previously we are using a single feature branching strategy in our current project. The single biggest mistake developers make is developing against the “Main” or “Trunk” line. This ultimately leads to messy code as things are added and never finished. Your only alternative is to NEVER check in unless your code is 100%, but this does not work in practice, even with a single developer. Your ADD will kick in and your half-finished code will be finished enough to pass the build and the tests. You do use builds don’t you? Sadly, this is a very common scenario and I have had people argue that branching merely adds complexity. Then again I have seen the other side of the universe ... branching  structures from he... We should somehow convince everyone that there is a happy between no-branching and too-much-branching. - Willy-Peter Schaub, VS ALM Ranger, Microsoft   A key benefit of branching for development is to isolate changes from the stable Main branch. Branching adds sanity more than it adds complexity. We do try to stress in our guidance that it is important to justify a branch, by doing a cost benefit analysis. The primary cost is the effort to do merges and resolve conflicts. A key benefit is that you have a stable code base in Main and accept changes into Main only after they pass quality gates, etc. - Bill Heys, VS ALM Ranger & TFS Branching Lead, Microsoft The second biggest mistake developers make is branching anything other than the WHOLE “Main” line. If you branch parts of your code and not others it gets out of sync and can make integration a nightmare. You should have your Source, Assets, Build scripts deployment scripts and dependencies inside the “Main” folder and branch the whole thing. Some departments within MSFT even go as far as to add the environments used to develop the product in there as well; although I would not recommend that unless you have a massive SQL cluster to house your source code. We tried the “add environment” back in South-Africa and while it was “phenomenal”, especially when having to switch between environments, the disk storage and processing requirements killed us. We opted for virtualization to skin this cat of keeping a ready-to-go environment handy. - Willy-Peter Schaub, VS ALM Ranger, Microsoft   I think people often think that you should have separate branches for separate environments (e.g. Dev, Test, Integration Test, QA, etc.). I prefer to think of deploying to environments (such as from Main to QA) rather than branching for QA). - Bill Heys, VS ALM Ranger & TFS Branching Lead, Microsoft   You can read about SSW’s Rules to better Source Control for some additional information on what Source Control to use and how to use it. There are also a number of branching Anti-Patterns that should be avoided at all costs: You know you are on the wrong track if you experience one or more of the following symptoms in your development environment: Merge Paranoia—avoiding merging at all cost, usually because of a fear of the consequences. Merge Mania—spending too much time merging software assets instead of developing them. Big Bang Merge—deferring branch merging to the end of the development effort and attempting to merge all branches simultaneously. Never-Ending Merge—continuous merging activity because there is always more to merge. Wrong-Way Merge—merging a software asset version with an earlier version. Branch Mania—creating many branches for no apparent reason. Cascading Branches—branching but never merging back to the main line. Mysterious Branches—branching for no apparent reason. Temporary Branches—branching for changing reasons, so the branch becomes a permanent temporary workspace. Volatile Branches—branching with unstable software assets shared by other branches or merged into another branch. Note   Branches are volatile most of the time while they exist as independent branches. That is the point of having them. The difference is that you should not share or merge branches while they are in an unstable state. Development Freeze—stopping all development activities while branching, merging, and building new base lines. Berlin Wall—using branches to divide the development team members, instead of dividing the work they are performing. -Branching and Merging Primer by Chris Birmele - Developer Tools Technical Specialist at Microsoft Pty Ltd in Australia   In fact, this can result in a merge exercise no-one wants to be involved in, merging hundreds of thousands of change sets and trying to get a consolidated build. Again, we need to find a happy medium. - Willy-Peter Schaub on Merge Paranoia Merge conflicts are generally the result of making changes to the same file in both the target and source branch. If you create merge conflicts, you will eventually need to resolve them. Often the resolution is manual. Merging more frequently allows you to resolve these conflicts close to when they happen, making the resolution clearer. Waiting weeks or months to resolve them, the Big Bang approach, means you are more likely to resolve conflicts incorrectly. - Bill Heys, VS ALM Ranger & TFS Branching Lead, Microsoft   Figure: Main line, this is where your stable code lives and where any build has known entities, always passes and has a happy test that passes as well? Many development projects consist of, a single “Main” line of source and artifacts. This is good; at least there is source control . There are however a couple of issues that need to be considered. What happens if: you and your team are working on a new set of features and the customer wants a change to his current version? you are working on two features and the customer decides to abandon one of them? you have two teams working on different feature sets and their changes start interfering with each other? I just use labels instead of branches? That's a lot of “what if’s”, but there is a simple way of preventing this. Branching… In TFS, labels are not immutable. This does not mean they are not useful. But labels do not provide a very good development isolation mechanism. Branching allows separate code sets to evolve separately (e.g. Current with hotfixes, and vNext with new development). I don’t see how labels work here. - Bill Heys, VS ALM Ranger & TFS Branching Lead, Microsoft   Figure: Creating a single feature branch means you can isolate the development work on that branch.   Its standard practice for large projects with lots of developers to use Feature branching and you can check the Branching Guidance for the latest recommendations from the Visual Studio ALM Rangers for other methods. In the diagram above you can see my recommendation for branching when using Scrum development with TFS 2010. It consists of a single Sprint branch to contain all the changes for the current sprint. The main branch has the permissions changes so contributors to the project can only Branch and Merge with “Main”. This will prevent accidental check-ins or checkouts of the “Main” line that would contaminate the code. The developers continue to develop on sprint one until the completion of the sprint. Note: In the real world, starting a new Greenfield project, this process starts at Sprint 2 as at the start of Sprint 1 you would have artifacts in version control and no need for isolation.   Figure: Once the sprint is complete the Sprint 1 code can then be merged back into the Main line. There are always good practices to follow, and one is to always do a Forward Integration from Main into Sprint 1 before you do a Reverse Integration from Sprint 1 back into Main. In this case it may seem superfluous, but this builds good muscle memory into your developer’s work ethic and means that no bad habits are learned that would interfere with additional Scrum Teams being added to the Product. The process of completing your sprint development: The Team completes their work according to their definition of done. Merge from “Main” into “Sprint1” (Forward Integration) Stabilize your code with any changes coming from other Scrum Teams working on the same product. If you have one Scrum Team this should be quick, but there may have been bug fixes in the Release branches. (we will talk about release branches later) Merge from “Sprint1” into “Main” to commit your changes. (Reverse Integration) Check-in Delete the Sprint1 branch Note: The Sprint 1 branch is no longer required as its useful life has been concluded. Check-in Done But you are not yet done with the Sprint. The goal in Scrum is to have a “potentially shippable product” at the end of every Sprint, and we do not have that yet, we only have finished code.   Figure: With Sprint 1 merged you can create a Release branch and run your final packaging and testing In 99% of all projects I have been involved in or watched, a “shippable product” only happens towards the end of the overall lifecycle, especially when sprints are short. The in-between releases are great demonstration releases, but not shippable. Perhaps it comes from my 80’s brain washing that we only ship when we reach the agreed quality and business feature bar. - Willy-Peter Schaub, VS ALM Ranger, Microsoft Although you should have been testing and packaging your code all the way through your Sprint 1 development, preferably using an automated process, you still need to test and package with stable unchanging code. This is where you do what at SSW we call a “Test Please”. This is first an internal test of the product to make sure it meets the needs of the customer and you generally use a resource external to your Team. Then a “Test Please” is conducted with the Product Owner to make sure he is happy with the output. You can read about how to conduct a Test Please on our Rules to Successful Projects: Do you conduct an internal "test please" prior to releasing a version to a client?   Figure: If you find a deviation from the expected result you fix it on the Release branch. If during your final testing or your “Test Please” you find there are issues or bugs then you should fix them on the release branch. If you can’t fix them within the time box of your Sprint, then you will need to create a Bug and put it onto the backlog for prioritization by the Product owner. Make sure you leave plenty of time between your merge from the development branch to find and fix any problems that are uncovered. This process is commonly called Stabilization and should always be conducted once you have completed all of your User Stories and integrated all of your branches. Even once you have stabilized and released, you should not delete the release branch as you would with the Sprint branch. It has a usefulness for servicing that may extend well beyond the limited life you expect of it. Note: Don't get forced by the business into adding features into a Release branch instead that indicates the unspoken requirement is that they are asking for a product spin-off. In this case you can create a new Team Project and branch from the required Release branch to create a new Main branch for that product. And you create a whole new backlog to work from.   Figure: When the Team decides it is happy with the product you can create a RTM branch. Once you have fixed all the bugs you can, and added any you can’t to the Product Backlog, and you Team is happy with the result you can create a Release. This would consist of doing the final Build and Packaging it up ready for your Sprint Review meeting. You would then create a read-only branch that represents the code you “shipped”. This is really an Audit trail branch that is optional, but is good practice. You could use a Label, but Labels are not Auditable and if a dispute was raised by the customer you can produce a verifiable version of the source code for an independent party to check. Rare I know, but you do not want to be at the wrong end of a legal battle. Like the Release branch the RTM branch should never be deleted, or only deleted according to your companies legal policy, which in the UK is usually 7 years.   Figure: If you have made any changes in the Release you will need to merge back up to Main in order to finalise the changes. Nothing is really ever done until it is in Main. The same rules apply when merging any fixes in the Release branch back into Main and you should do a reverse merge before a forward merge, again for the muscle memory more than necessity at this stage. Your Sprint is now nearly complete, and you can have a Sprint Review meeting knowing that you have made every effort and taken every precaution to protect your customer’s investment. Note: In order to really achieve protection for both you and your client you would add Automated Builds, Automated Tests, Automated Acceptance tests, Acceptance test tracking, Unit Tests, Load tests, Web test and all the other good engineering practices that help produce reliable software.     Figure: After the Sprint Planning meeting the process begins again. Where the Sprint Review and Retrospective meetings mark the end of the Sprint, the Sprint Planning meeting marks the beginning. After you have completed your Sprint Planning and you know what you are trying to achieve in Sprint 2 you can create your new Branch to develop in. How do we handle a bug(s) in production that can’t wait? Although in Scrum the only work done should be on the backlog there should be a little buffer added to the Sprint Planning for contingencies. One of these contingencies is a bug in the current release that can’t wait for the Sprint to finish. But how do you handle that? Willy-Peter Schaub asked an excellent question on the release activities: In reality Sprint 2 starts when sprint 1 ends + weekend. Should we not cater for a possible parallelism between Sprint 2 and the release activities of sprint 1? It would introduce FI’s from main to sprint 2, I guess. Your “Figure: Merging print 2 back into Main.” covers, what I tend to believe to be reality in most cases. - Willy-Peter Schaub, VS ALM Ranger, Microsoft I agree, and if you have a single Scrum team then your resources are limited. The Scrum Team is responsible for packaging and release, so at least one run at stabilization, package and release should be included in the Sprint time box. If more are needed on the current production release during the Sprint 2 time box then resource needs to be pulled from Sprint 2. The Product Owner and the Team have four choices (in order of disruption/cost): Backlog: Add the bug to the backlog and fix it in the next Sprint Buffer Time: Use any buffer time included in the current Sprint to fix the bug quickly Make time: Remove a Story from the current Sprint that is of equal value to the time lost fixing the bug(s) and releasing. Note: The Team must agree that it can still meet the Sprint Goal. Cancel Sprint: Cancel the sprint and concentrate all resource on fixing the bug(s) Note: This can be a very costly if the current sprint has already had a lot of work completed as it will be lost. The choice will depend on the complexity and severity of the bug(s) and both the Product Owner and the Team need to agree. In this case we will go with option #2 or #3 as they are uncomplicated but severe bugs. Figure: Real world issue where a bug needs fixed in the current release. If the bug(s) is urgent enough then then your only option is to fix it in place. You can edit the release branch to find and fix the bug, hopefully creating a test so it can’t happen again. Follow the prior process and conduct an internal and customer “Test Please” before releasing. You can read about how to conduct a Test Please on our Rules to Successful Projects: Do you conduct an internal "test please" prior to releasing a version to a client?   Figure: After you have fixed the bug you need to ship again. You then need to again create an RTM branch to hold the version of the code you released in escrow.   Figure: Main is now out of sync with your Release. We now need to get these new changes back up into the Main branch. Do a reverse and then forward merge again to get the new code into Main. But what about the branch, are developers not working on Sprint 2? Does Sprint 2 now have changes that are not in Main and Main now have changes that are not in Sprint 2? Well, yes… and this is part of the hit you take doing branching. But would this scenario even have been possible without branching?   Figure: Getting the changes in Main into Sprint 2 is very important. The Team now needs to do a Forward Integration merge into their Sprint and resolve any conflicts that occur. Maybe the bug has already been fixed in Sprint 2, maybe the bug no longer exists! This needs to be identified and resolved by the developers before they continue to get further out of Sync with Main. Note: Avoid the “Big bang merge” at all costs.   Figure: Merging Sprint 2 back into Main, the Forward Integration, and R0 terminates. Sprint 2 now merges (Reverse Integration) back into Main following the procedures we have already established.   Figure: The logical conclusion. This then allows the creation of the next release. By now you should be getting the big picture and hopefully you learned something useful from this post. I know I have enjoyed writing it as I find these exploratory posts coupled with real world experience really help harden my understanding.  Branching is a tool; it is not a silver bullet. Don’t over use it, and avoid “Anti-Patterns” where possible. Although the diagram above looks complicated I hope showing you how it is formed simplifies it as much as possible.   Technorati Tags: Branching,Scrum,VS ALM,TFS 2010,VS2010

    Read the article

< Previous Page | 40 41 42 43 44 45 46 47 48 49 50 51  | Next Page >