Destramic Posted March 24, 2011 Share Posted March 24, 2011 i have a page with no css or style sheet included but when view the html , $('selector').html(); is shows every tag, <input />, <br />, and <label> with style="display: inline;" in it...and i dont understand why if anyone can help please? Quote Link to comment Share on other sites More sharing options...
cssfreakie Posted March 24, 2011 Share Posted March 24, 2011 maybe because it's the natural behaviour for suchs elements, does it say display:block; on div's too? Quote Link to comment Share on other sites More sharing options...
Destramic Posted March 24, 2011 Author Share Posted March 24, 2011 yeah it does...can this be removed?...is this normal? Quote Link to comment Share on other sites More sharing options...
cssfreakie Posted March 24, 2011 Share Posted March 24, 2011 I don't know what browser/version you use, but if you don't have javascript that applies these style i guess it's normal. Quote Link to comment Share on other sites More sharing options...
Destramic Posted March 25, 2011 Author Share Posted March 25, 2011 It's the first time i've come across it with javascript as i've never noticed this effect with any of my other scripts...are you sure this is normal to have a style automatically added to a tag?...and i'm currently using firefox web browser Quote Link to comment Share on other sites More sharing options...
cssfreakie Posted March 25, 2011 Share Posted March 25, 2011 hmm i don't know much about javascript, all i know it can dd inline style and do some clientside stuff. And as far as i know no it's not normal to add inline style, but maybe the viewer adds it (really not sure on this one).Just to be sure, you have a page, and you just do view source, not firebug, but just view source right? Maybe try to disable javascript for a second refresh and view source again, that should eliminate any javascript effect. Quote Link to comment Share on other sites More sharing options...
KevinM1 Posted March 25, 2011 Share Posted March 25, 2011 @Destramic: Can you show us actual code? @cssfreakie: JavaScript can manipulate the DOM in its entirety - CRUD for both styles and elements. Quote Link to comment Share on other sites More sharing options...
cssfreakie Posted March 25, 2011 Share Posted March 25, 2011 @Destramic: Can you show us actual code? @cssfreakie: JavaScript can manipulate the DOM in its entirety - CRUD for both styles and elements. Yeah that's what i meant, just didn't want to give the impression i Know more than that Quote Link to comment Share on other sites More sharing options...
Destramic Posted March 25, 2011 Author Share Posted March 25, 2011 i hope this helps you to understand my problem: but you'll need jquery plugin : http://jquery.com/ and cookies : http://plugins.jquery.com/project/Cookie <!DOCTYPE html> <html> <head> <script type="text/javascript" src="js/library/jquery.js"></script> <script type="text/javascript" src="js/library/jquery.cookie.js"></script> </head> <body> <script> $(document).ready(function() { function add_input(selector, fields, field_type, break_point) { var count = 1; var loop_count = 1; var fields_count = $.param(fields).split('&').length; var breakage_point; var field_name; $('div#add_' + selector).click(function() { $.each(fields, function(field_name, field_label) { breakage_point = fields_count * count; field_name = field_name + count; input_field = '<label for="' + field_name + '">' + field_label + ' ' + count + ' : </label><input id="'+ field_name +'" name="' + field_name + '" type="' + field_type + '" value="" />'; if (loop_count == breakage_point) { input_field += '<br />'; } $(input_field).appendTo('div#' + selector).hide().fadeIn(1200); loop_count++; }); count++; $.cookie(selector + '_count', count); if (count > 1) { $('div#remove_' + selector).hide().fadeIn(1200); } }); $('div#remove_' + selector).click(function() { var remove_field = ''; $.each(fields, function(field_name, field_label) { field_name = field_name + (count - 1); field_label = field_label + ' ' + (count - 1); var field_value = $('#' + field_name).val(); remove_field += $('<label for="' + field_name + '">' + field_label + ' : </label><input id="' + field_name + '" name="' + field_name + '" value="' + field_value + '" type="text">'); alert($('div#' + selector).html()); }); if (loop_count == breakage_point) { remove_field += '<br>'; } var replace = $('div#' + selector).html().replace(remove_field, ''); $('div#' + selector).html(replace); count--; $.cookie(selector + '_count', count); if (count < 3) { $('div#remove_' + selector).fadeOut(1200); } }); if ($.cookie(selector + '_count')) { var cookie_count = $.cookie(selector + '_count'); for (i=1; i < cookie_count; i++) { $('div#add_' + selector).click(); } } if (count < 3) { $('div#remove_' + selector).hide(); } } var fields = {'game_types' : 'Game Type - Name', 'game_types_abbreviated' : 'Game Type - Abbreviated'}; add_input('game_types', fields, 'text', 2); }); </script> <form method="post"> <label for="game_name">Game Name:</label> <input id="game_name" name="game_name" value="" type="text" /><br /><a></a> <label for="game_name_abbreviated">Game Name Abbreviated:</label> <input id="game_name_abbreviated" name="game_name_abbreviated" value="" type="text" /><br /> <div id="game_types"></div><br /> <div id="add_game_types">Add Game Type</div> <div id="remove_game_types">Remove Game Type</div> <input type="submit" value="Submit"> </form> </body> </html> Quote Link to comment Share on other sites More sharing options...
cssfreakie Posted March 26, 2011 Share Posted March 26, 2011 I don't see anything in that code to adds inline style really. Can't it just be that the .hide() function from Jquery needs display inline, after you .show() it? That is my guess Anyways this seems more a javascript library question than a css one Quote Link to comment Share on other sites More sharing options...
KevinM1 Posted March 27, 2011 Share Posted March 27, 2011 What are you doing when you view the HTML? Simply selecting 'View Source'? Or doing something else? Browser tools may show implied/inherited styles, depending on which you may be using. You shouldn't be having inline styles added to your actual code. I've used jQuery many times without that sort of thing happening, but have never used the cookie plugin you have, so I can't vouch for it. Can you do a simple jQuery-only test to see if it's the plugin causing the problem, if there is indeed a problem? And, have you tested your full code with other browsers? Quote Link to comment Share on other sites More sharing options...
Destramic Posted March 27, 2011 Author Share Posted March 27, 2011 i found out that hide() / fadein() is the result to the added style $(input_field).appendTo('div#' + selector).hide().fadeIn(1200); Quote Link to comment Share on other sites More sharing options...
cssfreakie Posted March 27, 2011 Share Posted March 27, 2011 I don't see anything in that code to adds inline style really. Can't it just be that the .hide() function from Jquery needs display inline, after you .show() it? That is my guess Anyways this seems more a javascript library question than a css one good to hear you found it out. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.