So I'm having some issues here. These two javascripts are conflicting with one another. When they are alone, they both work but when put on the same page, only the error box works, first code box below. <script type="text/javascript"> $(function() { $('#overlay').fadeIn('fast',function(){ $('#box').animate({'top':'160px'},500); }); $('#boxclose').click(function(){ $('#box').animate({'top':'-200px'},500,function(){ $('#overlay').fadeOut('fast'); }); }); }); </script> Code (markup): and <script type="text/javascript" charset="utf-8">$(document).ready(function(){ $("input.login_hint").ezpz_hint(); });</script> Code (markup): This is a plugin as an alternative for placeholder since IE doesn't support it. Here's the JS of the plugin: (function($){[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] $.fn.ezpz_hint = function(options){[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] var defaults = {[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] hintClass: 'ezpz-hint',[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] hintName: 'ezpz_hint_dummy_input'[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] };[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] var settings = $.extend(defaults, options);[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] [/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] return this.each(function(){[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] var hint;[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] var dummy_input;[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] [/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] // grab the input's title attribute[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] text = $(this).attr('title');[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] [/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] // create a dummy input and place it before the input[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] $('<input type="text" name="temp" value="" />').insertBefore($(this));[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] [/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] // set the dummy input's attributes[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] hint = $(this).prev('input:first');[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] hint.attr('class', $(this).attr('class'));[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] hint.attr('size', $(this).attr('size'));[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] hint.attr('name', settings.hintName);[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] hint.attr('autocomplete', 'off');[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] hint.attr('tabIndex', $(this).attr('tabIndex'));[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] hint.addClass(settings.hintClass);[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] hint.val(text);[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] [/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] // hide the input[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] $(this).hide();[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] [/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] // don't allow autocomplete (sorry, no remember password)[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] $(this).attr('autocomplete', 'off');[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] [/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] // bind focus event on the dummy input to swap with the real input[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] hint.focus(function(){[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] dummy_input = $(this);[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] $(this).next('input:first').show();[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] $(this).next('input:first').focus();[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] $(this).next('input:first').unbind('blur').blur(function(){[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] if ($(this).val() == '') {[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] $(this).hide();[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] dummy_input.show();[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] }[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] });[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] $(this).hide();[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] });[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] [/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] // swap if there is a default value[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] if ($(this).val() != ''){[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] hint.focus();[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] };[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] [/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] // remove the dummy inputs so that they don't get submitted[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] $('form').submit(function(){[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] $('.' + settings.hintName).remove();[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] });[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] });[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] [/FONT][/COLOR] [COLOR=#141414][FONT=Verdana] };[/FONT][/COLOR] [COLOR=#141414][FONT=Verdana]})(jQuery); Code (markup): Any reason why? Trying to figure out where the conflict is... I'm sure it's slapping me in the face.
Ok and I think there is a bug in the forum... [COLOR=#141414][FONT=Verdana] Code (markup): That is added to all the code inserts. I just didn't erase the last one cause I would be here an hour erasing each line...
1) stupid animations are a waste of javascript - lets CSS do that for you, if it doesn't work in IE, OH WELL... it should not be a dealbreaker and in fact can get in the WAY of making the site useful. 2) Placeholder is what's called "fake" or "false" simplicity, and really just pisses on the usability of your page -- use a blasted label instead of the HTML 5 asshattery and any dumbass scripts for IE. Decent article on that here: http://baymard.com/blog/false-simplicity Problem solved -- js for nothing and your scripts for free... that's not working, and that's not how you do it. Of course ditching both of those would let you axe the jquery bloat and it's assorted idiotic BS that makes pages LESS useful.
@digitalpoint, thanks for the info. @deathshadow, I found an alternative. Works great now for the project I'm working on. I guess thanks for telling me to try something else? lol