Search Results

Search found 6478 results on 260 pages for 'hippy head'.

Page 92/260 | < Previous Page | 88 89 90 91 92 93 94 95 96 97 98 99  | Next Page >

  • Controls not aligning properly.

    - by RPK
    I am using following code to design my home page. The output (as shown below) is not appearing properly. You can see the banner going to far left and the navigation links have a huge gap in between. How to set this? Can it be done using only the DIV tag instead of TABLE? <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title> First Website </title> </head> <body> <table id="main" align="center" width="600 px"> <tr id="trBanner"> <td id="tdBanner"> <img src="../../../My Pictures/banner copy.bmp.jpg" </td> </tr> <tr id="trNavLinks"> <td id="lnkHome"> <a href="" id="lnkHome" name="lnkHome">Home</a> </td> <td id="lnkLife"> <a href="" id="lnkLife" name="lnkLife">Life</a> </td> <td id="lnkTeachings"> <a href="" id="lnkTeachings" name="lnkTeachings">Teachings</a> </td> <td id="lnkExperiences"> <a href="" id="lnkExperiences" name="lnkExperiences">Experiences</a> </td> <td id="lnkPhotoGallery"> <a href="" id="lnkPhotoGallery" name="lnkPhotoGallery">Photo Gallery</a> </td> <td id="lnkReach"> <a href="" id="lnkReach" name="lnkReach">How to Reach</a> </td> <td id="lnkContact"> <a href="" id="lnkContact" name="lnkContact">Contact Us</a> </td> </tr> </table> </body> </html>

    Read the article

  • Can't build full html table in QTextEdit with std::for_each...

    - by mosg
    Hi. Here is my code function: void ReportHistory::update(void) { ui.output->clear(); ui.output->setCurrentFont(QFont("Arial", 8, QFont::Normal)); QString title = "My Title"; QStringList headers = QString("Header1,Header2,Header3,Header4,Header5,Header6").split(","); QString html = QString( "<html>" \ "<head>" \ "<meta Content=\"Text/html; charset=Windows-1251\">" \ "<title>%1</title>" \ "</head>" \ "<body bgcolor=#ffffff link=#5000A0>" \ "<p>%1</p>" \ "<table border=1 cellspacing=0 cellpadding=2>" \ "<tr bgcolor=#f0f0f0>" ).arg(title); foreach (QString header, headers) { html.append(QString("<th>%1</th>").arg(header)); } html.append("</tr>"); struct Fill { QString html_; Analytics::NavHistory::History::value_type prev_; Fill(QString html) : html_(html) {} void operator ()(const Analytics::NavHistory::History::value_type& entry) { QStringList line = (QString( "%1|%2|%3|%4|%5|%6" ).arg(value1, 15) .arg(value2 ? ' ' : 'C', 8) .arg(value3, 15) .arg(value4, 15, 'f', 4) .arg(value5, 15) .arg(value6, 15, 'f', 4)).split("|"); html_.append("<tr>"); foreach (QString item, line) { html_.append("<td bkcolor=0>%1</td>").arg(item); } html_.append("</tr>"); prev_ = entry; } }; std::for_each(history_->data().begin(), history_->data().end(), Fill(html)); html.append( "</table>" \ "</body>" \ "</html>"); ui.output->setHtml(html); } Where: ui.output is a pointer to QTextEdit. Question: the ui.output just show me the headers, and not the full table, what is wrong? Thanks.

    Read the article

  • [JavaScript-CSS-Firefox] Cannot change borderColor of TD

    - by Tadeus Prastowo
    Using JS to set the background color of a TD is fine. But, setting the border color is problematic in FF 3.0.18 although IE 6 doesn't experience this. FF is problematic in that it requires the TD element to have an attribute style initialized to border-style: solid. Without that, setting border color of a TD won't work. Is this known bug? How do I set the border color without having to set style attribute as well as the initialization value? I know another trick of setting the class attribute instead of setting the border color directly. Is this an indication that somehow TD hates having its border color set dynamically? Is this known as well? The problematic code is below (the goal is find out why setting the border color of simple truth 1 does not work while simple truth 3 works when I employ the trick described above): <html> <head> <title>Quirks FF 3.0.18</title> <style type="text/css"> table { border-collapse: collapse; } </style> <script type="text/javascript"> function changeBgColor() { document.getElementById('simple').style.backgroundColor='yellow'; document.getElementById('simple2').style.backgroundColor='yellow'; document.getElementById('simple3').style.backgroundColor='yellow'; } function quirk(id) { var x = document.getElementById(id); x.style.border = '2px solid red'; } </script> </head> <body> <input type="button" onclick="changeBgColor()" value="Change background color"/> <input type="button" onclick="quirk('simple')" value="Change border color 1"/> <input type="button" onclick="quirk('simple2')" value="Change border color 2"/> <input type="button" onclick="quirk('simple3')" value="Change border color 3"/> <table> <tr><td id="simple">Simple truth 1</td></tr> </table> <table> <tr><td><span id="simple2">Simple truth 2</span></td></tr> <table> <tr><td id="simple3" style="border-style: solid">Simple truth 3</td></tr> </table> </body> </html>

    Read the article

  • CSS - margin and float property

    - by David Casillas
    1.- We have a div with static positioning. Inside we have a parragraph with a margin. The heigth of the div will be the parragraph without the margin 2.- We have a div with float:left. Inside we have a parragraph with a margin. The heigth of the div will be the parragraph plus its margin. What is the explanation of this? Here is the html code and the CSS code. And here is a link to the test site. http://prueba.davidcasillas.es/ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Untitled Document</title> <link href="index.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="nivel1"> <div id="nivel21"> <p>Este es el primer parrafo</p> </div> <div id="nivel22"> <p>Este es el primer parrafo</p> </div> </div> </body> </html> body { margin:0; padding:0; } #nivel1 { border:solid; border-color:#333; margin:0; background-color:#0F3; margin:2em; } #nivel21 { margin:2em; float:left; background-color:#C00; } #nivel22 { margin:2em; background-color:#FC0; }

    Read the article

  • 100% width table cell

    - by Elvis
    Hello! I have this table layout. I want to align the whole content to the right. So i'm using one cell with width: 100%;. Usually everything looks good and nice. But there is something, which i don't understand. If the content in cell, which has colspan, becomes bigger than normal cell in this column (you can test this by clicking Click to test button), it brakes whole layout. This happens on Chrome, Safari 4 and 5, IE8, but on Opera, FF and IE7 is OK. Any ideas? <!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>TEST</title> <style type="text/css"> table { width: 100%; } table td { border: 1px solid black; white-space: nowrap; } .delimiter { width: 100%; } </style> </head> <body> <table> <tr> <td><label>Row 1</label></td> <td>&nbsp;</td> <td><input type="text" value="Field 1" id="field1" size="25"></td> <td><input type="button" value="Click to test" onclick="var o = document.getElementById('field2'); o.size = o.size == 25 ? 50 : 25;"></td> <td class="delimiter">&nbsp;</td> </tr> <tr> <td><label>Row 2</label></td> <td>&nbsp;</td> <td colspan="3"><input type="text" id="field2" value="Field 2" size="25"></td> </tr> </table> </body> </html>

    Read the article

  • TDD a controller with ASP.NET MVC 2, NUnit and Rhino Mocks

    - by Nissan Fan
    What would a simple unit test look like to confirm that a certain controller exists if I am using Rhino Mocks, NUnit and ASP.NET MVC 2? I'm trying to wrap my head around the concept of TDD, but I can't see to figure out how a simple test like "Controller XYZ Exists" would look. In addition, what would the unit test look like to test an Action Result off a view?

    Read the article

  • jquery - establishing truths when loading inline javascript via AJAX

    - by yaya3
    I have thrown together a quick prototype to try and establish a few very basic truths regarding what inline JavaScript can do when it is loaded with AJAX: index.html <html> <head> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> </head> <body> <script type="text/javascript"> $('p').css('color','white'); alert($('p').css('color')); // DISPLAYS FIRST but is "undefined" $(document).ready(function(){ $('#ajax-loaded-content-wrapper').load('loaded-by-ajax.html', function(){ $('p').css('color','grey'); alert($('p').css('color')); // DISPLAYS LAST (as expected) }); $('p').css('color','purple'); alert($('p').css('color')); // DISPLAYS SECOND }); </script> <p>Content not loaded by ajax</p> <div id="ajax-loaded-content-wrapper"> </div> </body> </html> loaded-by-ajax.html <p>Some content loaded by ajax</p> <script type="text/javascript"> $('p').css('color','yellow'); alert($('p').css('color')); // DISPLAYS THIRD $(document).ready(function(){ $('p').css('color','pink'); alert($('p').css('color')); // DISPLAYS FOURTH }); </script> <p>Some content loaded by ajax</p> <script type="text/javascript"> $(document).ready(function(){ $('p').css('color','blue'); alert($('p').css('color')); // DISPLAYS FIFTH }); $('p').css('color','green'); alert($('p').css('color')); // DISPLAYS SIX </script> <p>Some content loaded by ajax</p> Notes: a) All of the above (except the first) successfully change the colour of all the paragraphs (in firefox 3.6.3). b) I've used alert instead of console.log as console is undefined when called in the 'loaded' HTML. Truths(?): $(document).ready() does not treat the 'loaded' HTML as a new document, or reread the entire DOM tree including the loaded HTML JavaScript that is contained inside 'loaded' HTML can effect the style of existing DOM nodes One can successfully use the jQuery library inside 'loaded' HTML to effect the style of existing DOM nodes One can not use the firebug inside 'loaded' HTML can effect the existing DOM (proven by Note a) Am I correct in deriving these 'truths' from my tests (test validity)? If not, how would you test for these?

    Read the article

  • Twitterbot/0.1,gzip(gfe),gzip(gfe)

    - by user342284
    I see a lot of this on my google app engine error log: 05-18 06:44AM 00.897 /NTp9 405 17ms 0cpu_ms 0kb Twitterbot/0.1,gzip(gfe),gzip(gfe) 128.242.241.133 - - [18/May/2010:06:44:00 -0700] "HEAD /NTp9 HTTP/1.1" 405 124 - "Twitterbot/0.1,gzip(gfe),gzip(gfe)" May I know what is this?

    Read the article

  • Why is ELMAH creating 2 reports for each error?

    - by Chris F
    I have setup ELMAH to create an XML log as well as send an email every time it encounters and unhandled exception in my ASP.NET MVC web application. However, creates 2 xml files for every error and sends to emails, seemingly identical each time. How do I stop this? My relevant web.config configuration sections are below. I thought the duplicate registration system.web and system.webServer may be causing the issue, but that's not the case. <configSections> ... <sectionGroup name="elmah"> <section name="security" requirePermission="false" type="Elmah.SecuritySectionHandler, Elmah" /> <section name="errorLog" requirePermission="false" type="Elmah.ErrorLogSectionHandler, Elmah" /> <section name="errorMail" requirePermission="false" type="Elmah.ErrorMailSectionHandler, Elmah" /> <section name="errorFilter" requirePermission="false" type="Elmah.ErrorFilterSectionHandler, Elmah" /> </sectionGroup> </configSections> <elmah> <security allowRemoteAccess="no"></security> <errorLog type="Elmah.XmlFileErrorLog, Elmah" logPath="~/Logs" /> <errorMail from="[email protected]" to="[email protected]" cc="[email protected]" subject="ELMAH: Site Error" async="true" smtpPort="25" smtpServer="xx.xx.xx.xx" /> </elmah> <system.web> ... <httpHandlers> ... <add verb="POST,GET,HEAD" path="elmah.axd" type="Elmah.ErrorLogPageFactory, Elmah" /> </httpHandlers> <httpModules> ... <add name="ErrorLog" type="Elmah.ErrorLogModule, Elmah"/> <add name="ErrorMail" type="Elmah.ErrorMailModule, Elmah"/> </httpModules> </system.web> <!-- for IIS7 --> <system.webServer> ... <modules runAllManagedModulesForAllRequests="true"> ... <add name="ErrorLog" type="Elmah.ErrorLogModule, Elmah"/> <add name="ErrorMail" type="Elmah.ErrorMailModule, Elmah"/> </modules> <handlers> ... <add verb="POST,GET,HEAD" path="elmah.axd" type="Elmah.ErrorLogPageFactory, Elmah" /> </handlers> </system.webServer>

    Read the article

  • ItemsPanel vs Grid vs GridSplitter

    - by bitbonk
    I am currently trying to build a ControlTemplate for an ItemsControl that uses the Grid as its ItemsPanel where each item is stacked horizontally and delimited with a GridSplitter. The basic goal is to have a dynamic bindable ItemsControl where all items stack up in a row and where each item can be resized with a splitter. There are two things I can't wrap my head around: How is the GridSplitter supposed to end up automatically between each item? How do I set Grid.Column for each item.

    Read the article

  • How to use regex to extract nested patterns

    - by Rob Romanek
    Hi I'm struggling with some regex I've got a string like this: a:b||c:{d:e||f:g}||h:i basically name value pairings. I want to be able to parse out the pairings so I get: a:b c:{d:e||f:g} h:i then I can further parse the pairings contained in { } if required It is the nesting that is making me scratch my head. Any regex experts out there that can give me a hand? thanks, Rob

    Read the article

  • Axis2 and OpenSAML

    - by Tom Kiley
    I'm trying to add SAML assertions to a SOAP web service that is built on the axis2 engine. I'm having a little trouble wrapping my head around how the two would interact. Could someone help point me in the right direction to add a SAML assertion to a response message from Axis2? Thanks, Tom

    Read the article

  • current_user and Comments on Posts - Create another association or loop posts? - Ruby on Rails

    - by bgadoci
    I have created a blog application using Ruby on Rails and have just added an authentication piece and it is working nicely. I am now trying to go back through my application to adjust the code such that it only shows information that is associated with a certain user. Currently, Users has_many :posts and Posts has_many :comments. When a post is created I am successfully inserting the user_id into the post table. Additionally I am successfully only displaying the posts that belong to a certain user upon their login in the /views/posts/index.html.erb view. My problem is with the comments. For instance on the home page, when logged in, a user will see only posts that they have written, but comments from all users on all posts. Which is not what I want and need some direction in correcting. I want only to display the comments written on all of the logged in users posts. Do I need to create associations such that comments also belong to user? Or is there a way to adjust my code to simply loop through post to display this data. I have put the code for the PostsController, CommentsController, and /posts/index.html.erb below and also my view code but will post more if needed. class PostsController < ApplicationController before_filter :authenticate auto_complete_for :tag, :tag_name auto_complete_for :ugtag, :ugctag_name def index @tag_counts = Tag.count(:group => :tag_name, :order => 'count_all DESC', :limit => 20) conditions, joins = {}, :votes @ugtag_counts = Ugtag.count(:group => :ugctag_name, :order => 'count_all DESC', :limit => 20) conditions, joins = {}, :votes @vote_counts = Vote.count(:group => :post_title, :order => 'count_all DESC', :limit => 20) conditions, joins = {}, :votes unless(params[:tag_name] || "").empty? conditions = ["tags.tag_name = ? ", params[:tag_name]] joins = [:tags, :votes] end @posts= current_user.posts.paginate( :select => "posts.*, count(*) as vote_total", :joins => joins, :conditions=> conditions, :group => "votes.post_id, posts.id ", :order => "created_at DESC", :page => params[:page], :per_page => 5) @popular_posts=Post.paginate( :select => "posts.*, count(*) as vote_total", :joins => joins, :conditions=> conditions, :group => "votes.post_id, posts.id", :order => "vote_total DESC", :page => params[:page], :per_page => 3) respond_to do |format| format.html # index.html.erb format.xml { render :xml => @posts } format.json { render :json => @posts } format.atom end end def show @post = Post.find(params[:id]) respond_to do |format| format.html # show.html.erb format.xml { render :xml => @post } end end def new @post = Post.new respond_to do |format| format.html # new.html.erb format.xml { render :xml => @post } end end def edit @post = Post.find(params[:id]) end def create @post = current_user.posts.create(params[:post]) respond_to do |format| if @post.save flash[:notice] = 'Post was successfully created.' format.html { redirect_to(@post) } format.xml { render :xml => @post, :status => :created, :location => @post } else format.html { render :action => "new" } format.xml { render :xml => @post.errors, :status => :unprocessable_entity } end end end def update @post = Post.find(params[:id]) respond_to do |format| if @post.update_attributes(params[:post]) flash[:notice] = 'Post was successfully updated.' format.html { redirect_to(@post) } format.xml { head :ok } else format.html { render :action => "edit" } format.xml { render :xml => @post.errors, :status => :unprocessable_entity } end end end def destroy @post = Post.find(params[:id]) @post.destroy respond_to do |format| format.html { redirect_to(posts_url) } format.xml { head :ok } end end end CommentsController class CommentsController < ApplicationController before_filter :authenticate, :except => [:show, :create] def index @comments = Comment.find(:all, :include => :post, :order => "created_at DESC").paginate :page => params[:page], :per_page => 5 respond_to do |format| format.html # index.html.erb format.xml { render :xml => @comments } format.json { render :json => @comments } format.atom end end def show @comment = Comment.find(params[:id]) respond_to do |format| format.html # show.html.erb format.xml { render :xml => @comment } end end # GET /posts/new # GET /posts/new.xml # GET /posts/1/edit def edit @comment = Comment.find(params[:id]) end def update @comment = Comment.find(params[:id]) respond_to do |format| if @comment.update_attributes(params[:comment]) flash[:notice] = 'Comment was successfully updated.' format.html { redirect_to(@comment) } format.xml { head :ok } else format.html { render :action => "edit" } format.xml { render :xml => @comment.errors, :status => :unprocessable_entity } end end end def create @post = Post.find(params[:post_id]) @comment = @post.comments.build(params[:comment]) respond_to do |format| if @comment.save flash[:notice] = "Thanks for adding this comment" format.html { redirect_to @post } format.js else flash[:notice] = "Make sure you include your name and a valid email address" format.html { redirect_to @post } end end end def destroy @comment = Comment.find(params[:id]) @comment.destroy respond_to do |format| format.html { redirect_to Post.find(params[:post_id]) } format.js end end end View Code for Comments <% Comment.find(:all, :order => 'created_at DESC', :limit => 3).each do |comment| -%> <div id="side-bar-comments"> <p> <div class="small"><%=h comment.name %> commented on:</div> <div class="dark-grey"><%= link_to h(comment.post.title), comment.post %><br/></div> <i><%=h truncate(comment.body, :length => 100) %></i><br/> <div class="small"><i> <%= time_ago_in_words(comment.created_at) %> ago</i></div> </p> </div> <% end -%>

    Read the article

  • JavaScript/Dojo Module Pattern - how to debug?

    - by djna
    I'm working with Dojo and using the "Module Pattern" as described in Mastering Dojo. So far as I can see this pattern is a general, and widely used, JavaScript pattern. My question is: How do we debug our modules? So far I've not been able to persuade Firebug to show me the source of my module. Firebug seems to show only the dojo eval statement used to execute the factory method. Hence I'm not able to step through my module source. I've tried putting "debugger" statements in my module code, and Firebug seems to halt correctly, but does not show the source. Contrived example code below. This is just an example of sufficient complexity to make the need for debugging plausible, it's not intended to be useful code. The page <!-- Experiments with Debugging --> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>console me</title> <style type="text/css"> @import "../dojoroot/dojo/resources/dojo.css"; @import "../dojoroot/dijit/themes/tundra/tundra.css"; @import "edf.css"; </style> <script type="text/javascript" src="../dojoroot/dojo/dojo.js"> </script> <script type="text/javascript" > dojo.registerModulePath("mytest", "../../mytest"); dojo.require("mytest.example"); dojo.addOnLoad(function(){ mytest.example.greet(); }); </script> </head> <body class="tundra"> <div id="bulletin"> <p>Just Testing</p> </div> </body> </html> <!-- END: snip1 --> The java script I'd like to debug dojo.provide("mytest.example"); dojo.require("dijit.layout.ContentPane"); /** * define module */ (function(){ //define the main program functions... var example= mytest.example; example.greet= function(args) { var bulletin = dojo.byId("bulletin"); console.log("bulletin:" + bulletin); if ( bulletin) { var content = new dijit.layout.ContentPane({ id: "dummy", region: "center" }); content.setContent('Greetings!'); dojo._destroyElement(bulletin); dojo.place(content.domNode, dojo.body(), "first"); console.log("greeting done"); } else { console.error("no bulletin board"); } } })();

    Read the article

  • css - get rid of spaces between spans

    - by opensas
    I'm trying to emulate a tab bar with html I'd like the width of each tab to be set according to the text lenght (that is, no fixed width) and to word wrap in case it exceeds the screen width I've almost achieved it <html> <head> <style type="text/css"> #myTabs .tab { float: left; } #myTabs .tab_middle { margin: 0; padding: 0; border: none; background-image:url('images/tabs/tab_middle.png'); } #myTabs .tab_left { margin: 0; padding: 0; border: none; background-image:url('images/tabs/tab_left.png'); } #myTabs .tab_right { margin: 0; padding: 0; border: none; background-image:url('images/tabs/tab_right.png'); } </style> </head> <body> <div id="myTabs"> <div class='tab'> <span class='tab_left'>&nbsp;</span> <span class='tab_middle'>very very looong</span> <span class='tab_right'>&nbsp;</span> </div> <div class='tab'> <span class='tab_left'>&nbsp;</span> <span class='tab_middle'>another loooong tab</span> <span class='tab_right'>&nbsp;</span> </div> <div style='clear:both'></div> </div> </body> </html> but, there's a very annoying space between the opening tab image and the closing one... as you can see I've tried with padding, spacin, and border, with no luck... any idea? thanks a lot saludos sas -- edit I tried replacing the spans with a small table (one row, three TDs) but it's the same, only the space between is smaller...

    Read the article

  • JavaScript recursion does not work properly

    - by misha-moroshko
    Hi, Could anyone say why the following recursive function does not work for me ? It should collect recursively all radio buttons in a given element. But, it does not found any for some reason !? Thanks !! <?xml version="1.0" encoding="Windows-1255"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <script type="text/javascript"> function AllInputs(radioElement) { this.radioInputs = ((arguments.length == 1) ? [radioElement] : []); } AllInputs.prototype.toString = function() { return "[object AllInputs: radioInputs: " + this.radioInputs.length + "]"; } AllInputs.prototype.add = function(otherAllInputs) { this.radioInputs = this.radioInputs.concat(otherAllInputs.radioInputs); } function getAllInputsOfElement(element) { if (element.tagName.toLowerCase() == "input") { if (element.getAttribute("type").toLowerCase() == "radio") { return new AllInputs(element); } else { return new AllInputs(); } } else { var result = new AllInputs(); for (i = 0; i < element.children.length; i++) { result.add(getAllInputsOfElement(element.children[i])); } return result; } } function main() { alert(getAllInputsOfElement(document.getElementById("MyTable"))); } </script> </head> <body onload="main()"> <table id="MyTable"> <tr><td>Day</td></tr> <tr><td> <input type="radio" name="DayOfTheWeek" value="1" /><label>Monday</label> <input type="radio" name="DayOfTheWeek" value="2" /><label>Tuesday</label> <input type="radio" name="DayOfTheWeek" value="3" /><label>Wednesday</label> </td></tr> </table> </body> </html>

    Read the article

  • Control third check box based on the state of the first two using jquery

    - by Moj
    I have three check boxes and need to disable the third if either and/or of the other two are checked. I'm sure there's a easier way than what I have currently. It's turning into what I believe is a mess and I'm hoping that someone with more jquery knowledge can shine the light here. Here's my simple html form: <html> <head> <script type="text/javascript" src="jquery.js"></script> <script src="custom.js" type="text/javascript"></script> </head> <body> <input type="checkbox" class="class" id="1">First <input type="checkbox" class="class" id="2">Second <input type="checkbox" class="class" id="3">Third </body> </html> Here's the javascript I'm using with jquery v1.4.2 jQuery(document).ready(function() { // watches the events of all checkboxes $(":checkbox").click(function(){ if( // if both 1 and 2 are checked we don't want to enable Third until both are unchecked. (($('#1:checkbox').attr('checked'))&&($('#2:checkbox').attr('checked')))|| ((($('#1:checkbox').attr('checked'))&&($('#2:checkbox').attr('checked')))&&($('#3:checkbox').attr('disabled')))|| ((($('#1:checkbox').attr('checked'))||($('#2:checkbox').attr('checked')))&&($('#3:checkbox').attr('disabled'))) ){ // we don't want to do anything in the above events } else if( // handles the First check box (($('#1:checkbox').attr('checked'))||(!$('#1:checkbox').attr('checked')))|| // handles the Second check box (($('#2:checkbox').attr('checked'))||(!$('#2:checkbox').attr('checked'))) ){ // call the disableThird function disableThird(); } }); // handles enabling and disabling the Third checkbox function disableThird(){ var $checkbox = $('#3:checkbox'); $checkbox.attr('disabled', !$checkbox.attr('disabled')); }; }); For some reason checking #3 will disable it's self. I don't understand why. This works, but one of the requirements is that a non programmer should be able to edit and maintain this. Ideally it'd be great if he could just add new check boxes to the html and it would work. The class for these are define and as far as I know can't be changed. The last check box in the list of check boxes will disable if any of the ones above are selected. Like wise if the last check box is selected, it will disable all the ones above it. I haven't even begun writing and testing that portion as this is quickly becoming too complicated for a non programmer to handle. I myself am more of a PHP coder than a js, let alone jquery, coder. Any help would be greatly appreciated.

    Read the article

  • Why does this CSS example use "height: 1%" with "overflow: auto"?

    - by Lawrence Lau
    I am reading a HTML and CSS book. It has a sample code of two-column layout. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <style> #main {height: 1%; overflow: auto;} #main, #header, #footer {width: 768px; margin: auto;} #bodycopy { float: right; width: 598px; } #sidebar {margin-right: 608px; } #footer {clear: both; } </style> </head> <body> <div id="header" style='background-color: #AAAAAA'>This is the header.</div> <div id="main" style='background-color: #EEEEEE'> <div id="bodycopy" style='background-color: #BBBBBB'> This is the principal content.<br /> This is the principal content.<br /> This is the principal content.<br /> This is the principal content.<br /> This is the principal content.<br /> This is the principal content.<br /> This is the principal content.<br /> This is the principal content.<br /> This is the principal content.<br /> This is the principal content.<br /> This is the principal content.<br /> This is the principal content.<br /> This is the principal content.<br /> This is the principal content.<br /> This is the principal content.<br /> </div> <div id="sidebar" style='background-color: #CCCCCC'> This is the sidebar. </div> </div> <div id="footer" style='background-color: #DDDDDD'>This is the footer.</div> </body> </html> The author mentions that the use of overflow auto and 1% height will make the main area expand to encompass the computed height of content. I try to remove the 1% height and tried in different browsers but they don't show a difference. I am quite confused of its use. Any idea?

    Read the article

  • IE6 "frame" layout with 100% height and scrollbars

    - by Joe
    I want to achieve a simple "frame" layout with fixed header, fixed left navigation area, and a main content area that fills 100% of the remainder of the viewport with scrollbars if necessary. My best attempt is below - but when I add enough content to the main div to force scrolling, I see that the scrollbar extends below the bottom of the viewport. What am I doing wrong? Or what is IE6 doing wrong and how can I fix it? NB please don't recommend using a more recent browser - I'd love to but can't. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head> <title></title> <style type="text/css"> html, body { height:100%; margin:0; padding:0; overflow:hidden; } div { border:0; margin:0; padding:0; } div#top { background-color:#dddddd; height:100px; } div#left { background-color:#dddddd; float:left; width:120px; height:100%; overflow:hidden; } div#main { height:100%; overflow:auto; } </style> </head> <body> <div id="top">Title</div> <div id="left">LeftNav</div> <div id="main"> Content <p> Lorem ipsum ... </p> ... repeated several times ... </div> </body> </html>

    Read the article

  • Event not bubbling in some Browsers when clicked on Flash

    - by 166_MMX
    Environment: Windows 7, Internet Explorer 8, Flash ActiveX 10.1.53.64, wmode=transparent Just wrote a small test page that you can load in IE and Firefox or any other Browser. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Event bubbling test</title> </head> <body onclick="alert('body');" style="margin:0;border-width:0;padding:0;background-color:#00FF00;"> <div onclick="alert('div');" style="margin:0;border-width:0;padding:0;background-color:#FF0000;"> <span onclick="alert('span');" style="margin:0;border-width:0;padding:0;background-color:#0000FF;"> <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://fpdownload.macromedia.com/get/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="159" height="91" id="flashAbout_small" align="absmiddle"> <param name="movie" value="http://www.adobe.com/swf/software/flash/about/flashAbout_info_small.swf"/> <param name="quality" value="high"/> <param name="bgcolor" value="#FFFFFF"/> <param name="wmode" value="transparent"/> <embed src="http://www.adobe.com/swf/software/flash/about/flashAbout_info_small.swf" quality="high" bgcolor="#FFFFFF" width="159" height="91" wmode="transparent" name="flashAbout_small" align="absmiddle" type="application/x-shockwave-flash" pluginspage="http://www.adobe.com/go/getflashplayer"/> </object> </span> </div> </body> </html> So clicking any colored shape should produce an alert (except for the green one in IE, not sure why but I hope that's off topic and not related to my issue). Clicking the Flash container in Firefox will work Perfectly fine. You should get alert boxes in this order containing: span, div and body. Flash bubbles the event to the HTML. But this is not happening in IE. So why is Flash in IE not bubbling events to HTML? Edit: As mentioned by Andy E this behavior can also bee seen in Google Chrome which to my knowledge is not using ActiveX to embed the flash movie into the page.

    Read the article

  • CSS Background-Images Loading after HTML Images (Involves Javascript)

    - by Kevin C.
    I threw together a quick little microsite that you can see at http://monterraauction.com. If you don't have a super-fast connection (and nothing's cached), the very last items to load are the background-images that are used for CSS image-text replacement (primarily, that h1#head at the top, with a 7kb background image). Nothing debilitating, but it looks slightly awkward. And I'm asking this question as a matter of curiosity more than anything else ;) Also, please note that this occurs in Firefox, but not Chrome. Now, underneath the h1#head I have a jquery.cycle.lite-powered slideshow in div#photo. In the HTML markup there are a total of 13, heavy image files that make up each of the slides. If I remove all but the first slide, then the problem goes away! So the CSS background-images are loading after...those HTML images are done? But here's what's confusing: I check it out in YSlow...the CSS background-images have a much lower response time than all of the slides in #photo. Right after all the JS files finish loading, in fact. So why aren't they showing up first? I tried $('#photo img:last-child').load(function() { alert('Locked and Loaded!')});, but the background-images pop up a while before the alert does, so I'm assuming it's not waiting until the last slide has loaded (admittedly I'm a bit of JS noob so maybe I'm just making a wrong assumption). I also tried commenting out all the jquery.cycle.lite stuff, so that I knew I didn't have any JS manipulating the DOM elements in #photo, but that wasn't the problem. I tried putting all the JS at the bottom of the document, right before </body>, but that didn't work. Lastly, I tried turning off javascript, and of course the css background-image loads way before the images in #photo, so it's definitely a JS thing (amirite?) I guess the obvious solution here is to mark the slides up as LINKS rather than IMGs, and have Javascript insert those 12 extra slideshow images after the DOM is ready--users without javascript shouldn't need to download the extra images anyways. But again, I'm curious: Why does removing the extra HTML images from within #photo solve the problem? And why are the CSS background-images showing up after the HTML images have loaded, even though YSlow says the css background-images loaded first? Seeing as how it happens in FF but not Chrome, is it simply a browser issue? I appreciate any insight you guys could give me!

    Read the article

  • xslt (table) by matching the attribute value.

    - by Magesh
    i need to generate an xsl table for the xml below , for atrributes fname and lname.. i have done something worng in xpath i guess.could someone help me out writing an xsl table for the xml below.. <sparql> - <head> <variable name="s"/> <variable name="fname"/> <variable name="lname"/> </head> - <results> - <result> - <binding name="s"> <uri>http://tn.gov.in/Person/41</uri> </binding> - <binding name="fname"> <literal>Gayathri</literal> </binding> - <binding name="lname"> <literal>Vasudevan</literal> </binding> </result> - <result> - <binding name="s"> <uri>http://tn.gov.in/Person/43</uri> </binding> - <binding name="fname"> <literal>Vivek</literal> </binding> - <binding name="lname"> <literal>Vasudevan</literal> </binding> </result> - <result> - <binding name="s"> <uri>http://tn.gov.in/Person/37</uri> </binding> - <binding name="fname"> <literal>Magesh</literal> </binding> - <binding name="lname"> <literal>Vasudevan</literal> </binding> </result> - <result> - <binding name="s"> <uri>http://tn.gov.in/Person/39</uri> </binding> - <binding name="fname"> <literal>Vasudevan </literal> </binding> - <binding name="lname"> <literal>Srinivasan</literal> </binding> </result> </results>

    Read the article

< Previous Page | 88 89 90 91 92 93 94 95 96 97 98 99  | Next Page >