Search Results

Search found 9661 results on 387 pages for 'div'.

Page 177/387 | < Previous Page | 173 174 175 176 177 178 179 180 181 182 183 184  | Next Page >

  • DHTML with Javascript and CSS is not working

    - by Dennis Hodapp
    So for some reason this unobtrusive javascript code is not working and I can't figure out for the life of me why it won't work. I dynamically change the className of a div element and therefore I expect the CSS to reflect that change. However it doesn't. Here's the simplified code. html: <head> <title>Your Page</title> <link rel="stylesheet" type="text/css" href="style.css" /> <script type="text/javascript" src="us.js"></script> </head> <body> <div id="wrapper"> <h1 id="title">Your Page</h1> </div> </body> javascript: window.onload = function() { document.getElementById("wrapper").className = "2"; } css: #wrapper{ background-color: white; } #wrapper.1 { background-color: black; } #wrapper.2 { background-color: red; } #wrapper.3 { background-color: blue; } I look at the wrapper div in firebug and it shows the class being changed to "2". However, the webpage doesn't reflect that by changing the background color to be red. (it doesn't work with changing text color either. I tried that.). I know the CSS is correctly loading. So what is the problem?

    Read the article

  • Post Loading ads - using appendChild to move an IFRAME with text link ads

    - by Prem
    I have changed code around to basically load an add the bottom of the page in a hidden div and attached an onload event handler that called document.getElementById(xxx).appendChild() to take the hidden ad and move it into the right spot in my page. This works GREAT.. however when the ad is a text ad it AFTER i move the ad there is nothing in the rendered Iframe. I did tests to see what it looks like before i move it and sure enough the text links load in the IFRAME but the second i do the appendChild call to move the div that contains the ad i seem to loose the contents of the Iframe. Any ideas whats going on <div id="myad" style="display: none;"> GA_googleFillSlot("MyADSlotName"); </div> <script> window.onload = function() { // leader board document.getElementById('adplaceholder').appendChild(document.getElementById('myAd')); document.getElementById('myAd').style.display = ''; </script> UPDATE: I think what the problem here is that on text ads google writes to the iframe directly inserting the relevant text links where are on other ads it uses the iframe to just point to some src. seems like when i do the appendchild, if there is no "src" set for the iframe after the copy is done the iframe in the new location contains nothing... guess it does a reload on the src? Any way around this??

    Read the article

  • Change the source of image by clicking thumbnail using updatePanel

    - by Batu
    For example, i have this ImageViewer.ascx UserControl: <div class="ImageTumbnails"> <asp:ListView ID="ImageList" runat="server" ItemPlaceholderID="ItemContainer"> <LayoutTemplate> <asp:PlaceHolder ID="ItemContainer" runat="server" /> </LayoutTemplate> <ItemTemplate> <asp:HyperLink runat="server" NavigateUrl='<%# Link.ToProductImage(Eval("ImageFile").ToString())%>'> <asp:Image runat="server" ImageUrl='<%# Link.ToThumbnail(Eval("ImageFile").ToString()) %>' /> </asp:HyperLink> </ItemTemplate> </asp:ListView> </div> <div class="ImageBig"> <asp:Image ID="ProductImageBig" runat="server" ImageUrl="" /> </div> When the thumbnail is clicked it will change the source of ProductImageBig with its hyperlink target. How can i achieve this using UpdatePanel ? ( Or will i be able to )

    Read the article

  • Jquery Flexslider - can't see navigational images (manualControl)

    - by Kim Thomas
    I've spent a lot of time looking at the post on 3/13/12 re: manual controls, but isn't getting me all the way there...probably because I don't know jquery. Sorry, newbie on board. I'm trying to get the right/left arrows to show, as well as the 1, 2, 3...at the bottom. They are there, I see the lists on Firebug, just don't know how to add them to the "hook" (?) so they appear. Here is the code I have in header: <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script> <script src="jquery.flexslider.js"></script> <script type="text/javascript" charset="utf-8"> $(window).load(function() { $('.flexslider').flexslider({ animation: "slide", slideshow: false, controlNav: true, manualControls: ".flex-control-nav li a", controlsContainer: ".flex-container" }); }); </script> Here is my html: <div class="flex-container"> <div class="flexslider"> <ul class="slides"> <li><img src="images/tah_home.jpg" alt="taylor art house home page" width="600" height="320"/> <p class="flex-caption">Taylor Art House Home Page</p></li> <li><img src="images/tah_blog.jpg" alt="taylor art house blog page" width="600" height="320" /> <p class="flex-caption">We created a blog that fits seemlessly into Taylor Art House's look</p></li> <li><img src="images/tah_artwork_page.jpg" alt="taylor art house art page" width="600" height="320" /> <p class="flex-caption">One of Taylor Art House's gallery pages, using a Wordpress plugin</p></li> <li><img src="images/tah_arch_portfolio.jpg" alt="jon taylor architecture portfolio page" width="600" height="320" /> <p class="flex-caption">We created links to toggle from TAH to Jon Taylor Architecture</p></li> </ul> </div><!--end flexsider--> </div><!--end flex-container--> Here is the Flexslider CSS: /* * jQuery FlexSlider v1.8 * http://www.woothemes.com/flexslider/ * * Copyright 2012 WooThemes * Free to use under the MIT license. * http://www.opensource.org/licenses/mit-license.php */ /* Browser Resets */ .flex-container a:active, .flexslider a:active, .flex-container a:focus, .flexslider a:focus {outline: none;} .slides, .flex-control-nav, .flex-direction-nav {margin: 0; padding: 0; list-style: none;} /* FlexSlider Necessary Styles *********************************/ .flexslider { width: 100%; margin: 0; padding: 0; } .flexslider .slides > li { display: none; -webkit-backface-visibility: hidden; } /* Hide the slides before the JS is loaded. Avoids image jumping */ .flexslider .slides img { max-width: 100%; display: block; } .flex-pauseplay span { text-transform: capitalize; } /* Clearfix for the .slides element */ .slides:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } html[xmlns] .slides { display: block; } * html .slides { height: 1%; } /* No JavaScript Fallback */ /* If you are not using another script, such as Modernizr, make sure you * include js that eliminates this class on page load */ .no-js .slides > li:first-child { display: block; } /* FlexSlider Default Theme *********************************/ .flexslider { width: 600px; background: #fff; border: 4px solid #999; position: relative; margin: 30px 0; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; zoom: 1; } .flexslider .slides { zoom: 1; } .flexslider .slides > li { position: relative; } /* Suggested container for "Slide" animation setups. Can replace this with your own, if you wish */ .flex-container { zoom: 1; position: relative; margin-left:100px; } /* Caption style */ /* IE rgba() hack */ .flex-caption { background:none; -ms-filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000); zoom: 1; } .flex-caption { width: 96%; padding: 2%; margin: 0; position: absolute; left: 0; bottom: 0; background: rgba(0,0,0,.3); color: #fff; text-shadow: 0 -1px 0 rgba(0,0,0,.3); font-size: 14px; line-height: 18px; } /* Direction Nav */ .flex-direction-nav { height: 0; } .flex-direction-nav li a { width: 52px; height: 52px; margin: -13px 0 0; display: block; background: url(theme/bg_direction_nav.png) no-repeat; position: absolute; top: 50%; cursor: pointer; text-indent: -999em; } .flex-direction-nav li .next { background-position: -52px 0; right: -21px; } .flex-direction-nav li .prev { left: -20px; } .flex-direction-nav li .disabled { opacity: .3; filter:alpha(opacity=30); cursor: default; } /* Control Nav */ .flex-control-nav { width: 100%; position: absolute; bottom: -30px; text-align: center; } .flex-control-nav li { margin: 0 0 0 5px; display: inline-block; zoom: 1; *display: inline; } .flex-control-nav li:first-child { margin: 0; } .flex-control-nav li a { width: 13px; height: 13px; display: block; background: url(theme/bg_control_nav.png) no-repeat; cursor: pointer; text-indent: -999em; } .flex-control-nav li a:hover { background-position: 0 -13px; } .flex-control-nav li a.active { background-position: 0 -26px; cursor: default; } Here is how it appears in Firebug: <div class="flex-container"> <div class="flexslider" style="overflow: hidden;"> <ul class="slides" style="width: 1200%; margin-left: -1800px;"> <li class="clone" style="width: 600px; float: left; display: block;"> <li style="width: 600px; float: left; display: block;"> <li style="width: 600px; float: left; display: block;"> <li style="width: 600px; float: left; display: block;"> <li style="width: 600px; float: left; display: block;"> <li class="clone" style="width: 600px; float: left; display: block;"> </ul> </div> <ol class="flex-control-nav"> <li> <a class="">1</a> </li> <li> <li> <li> </ol> <ul class="flex-direction-nav"> <li> <a class="prev" href="#">Previous</a> </li> <li> <a class="next" href="#">Next</a> </li> </ul> </div> Finally, here is a link to the jsFiddle file (I saw someone wanted that in other flexslider post): http://jsfiddle.net/kthms/Wxmsp/ Link to page: http://www.kajortdesigns.com/tah.php I've tried every combo of class from the CSS in the manualControl: "", but I'm just guessing. If anyone can help this newbie out, I would be very appreciative. Explicit instructions are always appreciated.

    Read the article

  • link_to_function toggle problem - Ruby on Rails

    - by bgadoci
    I asked this question back in November and everything seemed to work just fine. I am recently trying to implement it again and running into a problem. I am not receiving any error message, just can't get the toggle to work. Using Rails 2.3.5 and Ruby 1.8.7. See anything wrong here? View <%= javascript_include_tag :defaults %> <div id="comment-toggle"> <%= link_to_function "toggle", "$('comments_#{project.id}').toggle()" %> </div> <div id="comments_<%= project.id %>" class="comments" > <%= render :partial => project.comments %> <% remote_form_for [project, Comment.new] do |f| %> <p> <%= f.label :body, "New Comment" %><br/> <%= f.text_area (:body, :class => "textarea") %> </p> <p> <%= f.label :name, "Name" %> (Required)<br/> <%= f.text_field (:name, :class => "textfield") %> </p> <p> <%= f.label :email, "Email" %> (Required but will not be displayed)<br/> <%= f.text_field (:email, :class => "textfield") %> </p> <p><%= f.submit "Add Comment" %></p> <% end %> </div>

    Read the article

  • Switching between iScroll and standard WebView Scrolling functionality

    - by Jonathan
    I'm using iScroll 4 for my rather heavy iPhone web/Phonegap app and trying to find a way to switch between iScrolls scrolling functionality and standard "native" webview scrolling, basically on click. Why I want this is described below. My app has several different subpages all in one file. Some subpages have input fields, some don't. As we all know, iScroll + input fields = you're out of luck. I've wrapped iScrolls wrapper div (and all its functionality) around the one sub page where scrolling is crucial, and where there are no input fields. The other sections, I've simply placed outside this div, which gives these no scrolling functionality at all. I've of course tried wrapping all inside the wrapper and enabling/disabling scroll (shown below) but that didn't work me at all: myScroll.disable() myScroll.enable() By placing some sub pages outside the main scrolling area / iscroll div, I've disabled both iScrolls and the standard webview scrolling (the latter - which i guess iScroll does) which leaves me with only basic basic scrolling, hence basically no scrolling at all. One can move around vertically, but once you let go of the screen with, the "scrolling" stops. Quite naturally but alas so nasty. Therefore, I'm searching for a way to enable standard webview scrolling on the sub pages placed outside of iScroll's wrapper div. I've tried different approaches such as the one above and by using: document.removeEventListener('touchmove', preventDefault, false); document.removeEventListener('touchmove', preventDefault, true); But with no success. Sorry for not providing you guys with any hard code or demos to test out for yourselves, it's simply too much code and it would be presented so out of its context, nobody would be able to debug it. So, is there a way n javascript to do this, switching between iScroll scrolling functionality and standard "native" webview scrolling? I would rather not rebuild the entire DOM framework so a solution like the one described above would be preferable.

    Read the article

  • onMouseOver not working fine with hover

    - by Lina
    Hi, i'm trying to get a popup window when hovering a div by calling the following function onMouseOver function PopUp(h) { $('#task_' + h).hover(function (evt) { var html1 = '<div id="box">'; html1 += '<h4>Taskbar ' + h + ' ännu en test - fredagstest </h4>'; //html += '<img src="Pictures/DesertMini.jpg" alt="image"/>'; html1 += '<p>"Test för task nr: ' + h + ' <br/>At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium asperiores repellat."</p>'; html1 += '</div>'; $('#test').append(html1).children('#box').hide().fadeIn(100) $('#box') .css('top', evt.pageY) .css('left', evt.pageX + 20) .css('z-index', 1000000); }, function () { // mouse out $('#box').remove(); }); $('#task_' + h).mousemove(function (evt) { $('#box') .css('top', evt.pageY) .css('left', evt.pageX + 20) .css('z-index', 1000000); }); } } h is some number I'm sending to the function <div (some attributes) onMouseOver="PopUp('+someNumber+');"> but the onMouseOver is not working fine with the hover what do i do? thanks a trillion in advance... Lina

    Read the article

  • Destroying descendants for dojox.layout.ContentPane

    - by Luigi
    Hi, I just want to clean all the content of my dojox pane before load another page. There is an attribute called cleanContent that seems not working. Anyway this is a jsp page I import: <head> <script type="text/javascript" src="./js/listMetadataClass.js"></script> <script type="text/javascript" src="./js/utility.js"></script> <link rel="stylesheet" type="text/css" href="../dojo/dijit/themes/tundra/tundra.css"> <link rel="stylesheet" type="text/css" href="../dojo/dojox/grid/resources/tundraGrid.css"> </head> <div dojoType="dijit.layout.ContentPane"> <h3>List of existing Metadata Class:</h3> <table id="gridNode" style="width:auto; height:300px;"></table> <div id="dialogNode"></div> </div> Anyway is this the correct way to import a page inside the dojox pane? Thanks Luigi

    Read the article

  • How do I dynamically create a document for download in Javascript?

    - by Nelson
    I'm writing some Javascript code that generates an XML document in the client (via Google Earth plugin). I'd like the user to be able to click a button on the page and be prompted to save that XML to a new file. If I were generating the XML server-side this would be easy, just make the button open the link. But the XML is generated client-side. I've come up with a couple of hacks that half-work, inspired in part by this StackOverflow question. But neither completely work. Here's a demo HTML with embedded code: <html><head><script> function getData() { return '<?xml version="1.0" encoding="UTF-8"?><doc>Hello</doc>'; } function dlDataURI() { window.open("data:text/xml;charset=utf-8," + getData()); } function dlWindow() { var w = window.open(); w.document.open(); w.document.write(getData()); w.document.close(); } </script><body> <div onclick="dlDataURI()">Click for Data URL</div> <div onclick="dlWindow()">Click for Window</div> </body></html> The dlDataURI() version works great in Firefox, poorly in Chrome (can't save), and not at all in IE. The Window() version works OK in Firefox and IE, and not well in Chrome (can't save, XML embedded inside HTML). Neither version ever prompts a user download, it always opens a new window trying to display the XML. Is there a good way to do what I want in client side Javascript? I'd like this to work in today's browsers, ideally Firefox, MSIE 8, and Chrome.

    Read the article

  • jQuery - dynamic variables?

    - by user331884
    Newbie question. Given the following html. <div id="mycontainer1" class="container"> <input type="text" class="name"/> <input type="text" class="age"/> </div> <div id="mycontainer2" class="container"> <input type="text" class="name"/> <input type="text" class="age"/> <input type="text" class="address"/> </div> I'm trying to create a function where I can pass an element id and an array that contains the classes of the input values I want to get. So for example, var inputClasses = ['name','age']; getInputValue('#myContainer1', inputClasses); function getInputValue(elem, arr) { var temp = {}; $(elem).each(function() { // need a way to map items in array to variables // but how do I do this dynamically? var nameValue = $(this).find('.name').val(); var ageValue = $(this).find('.age').val(); });

    Read the article

  • dojo.io.iframe erroring when uploading a file

    - by Grant Collins
    Hi, Hit an interesting problem today when trying to upload an image file < 2MB using dojo.io.iframe. My function to process the form is called, but before the form is posted to the server I am getting the following error: TypeError: ifd.getElementsByTagName("textarea")[0] is undefined My function that is used to action the post of the form is : function uploadnewlogo(){ var logoDiv = dojo.byId('userlogo'); var logoMsg = dojo.byId('uploadmesg'); //prep the io frame to send logo data. dojo.io.iframe.send({ url: "/users/profile/changelogo/", method: "post", handleAs: "text", form: dojo.byId('logoUploadFrm'), handle: function(data,ioArgs){ var response = dojo.fromJson(data); if(response.status == 'success'){ //first clear the image //dojo.style(logoDiv, "display", "none"); logoDiv.innerHTML = ""; //then we update the image logoDiv.innerHTML = response.image; }else if(response.status == 'error'){ logoMsg.innerHTML = data.mesg; }else{ logoMsg.innerHTML = '<div class="error">Whoops! We can not process your image.</div>'; } }, error: function(data, ioArgs){ logoMsg.innerHTML = '<div class="error">' + data + '</div>'; } }); } The form is very basic with just a File input component and a simple button that calls this bit of javascript and dojo. I've got very similar code in my application that uploads word/pdf documents and that doesn't error, but for some reason this does. Any ideas or pointers on what I should try to get this to work without errors? Oh I'm using php and Zend framework for the backend if that has anything to do with it, but I doubt it as it's not even hitting the server before it fails. Many thanks, Grant

    Read the article

  • Jquery star rating plugin and cancel rating button

    - by Roger
    Using this plugin: http://www.fyneworks.com/jquery/star-rating/#tab-Testing I have a simple callback function that picks up the id from the radio buttons: <input type="radio" class="auto-submit-star {split:2}" id="myid" value="1" /> $('.auto-submit-star').rating({ callback: function(value, link){ alert($(this).attr('id')); } }); This works fine, but if the user clicks on the cancel button, then it can't read the id of it. In the js, I think the cancel button is added dynamically with: control.cancel = $('<div class="rating-cancel"><a title="' + control.cancel + '">' + control.cancelValue + '</a></div>') If I add an id to it like this: control.cancel = $('<div class="rating-cancel"><a id="someid" title="' + control.cancel + '">' + control.cancelValue + '</a></div>') How could I read the id? This would be undefined. I can set a class and use $('.myclass').attr('id') but I will have multiple ratings on one page so I'll need something similar to "this". Or is it possible for the cancel button to pick up the id of the corresponding radio buttons?

    Read the article

  • JQuery not Working in chrome?

    - by Pete Herbert Penito
    Hi everyone! I have some code here which works perfectly in firefox but not in chrome or IE, my javascript is thus ` $(document).ready(function() { $("#clientLoginPop").show(); $("#clientLoginPop").animate({"left": "-=400px"}, "fast"); }); $("#clientLoginCloseLink").click(function () { $("#clientLoginPop").animate({"left": "+=400px"}, "fast"); }); $("#contactUsPopLink").click(function () { $("#contactUsPop").show(); $("#contactUsPop").animate({"left": "-=437px"}, "fast"); }); $("#contactUsClose").click(function () { $("#contactUsPop").animate({"left": "+=474px"}, "fast"); }); }); ` and finally the css of the div looks like this, i think rather importantly it's aligned to the right of the browser: (the client login div looks similar just a different height) ` #contactUsPop { width:437px; right:-437px; margin-top:220px; position:fixed; height:217px; background-color:white; z-index:2; } ` so what happens in firefox is the div animates to the left and then when it closes it moves back to the right. when in chrome the div doesn't seem to pop up at all? the URL of the site is this: http://clearcreativegroup.com/devcorner/clear3/ the tabs are on the right hand side of the browser, any advice would help tons, thank you!

    Read the article

  • calling Valums Ajax uploader from other DOM element

    - by Marc
    I'm facing a problem with the valums Ajax File upload. Since the plugin is working perfectly after a few modifications on the server side, I cannot implement a specific behavior. My DOM is composed with an input file plus the container to instantiate the fileuploader buttons. What I want is to be able to fire the fileuploader plugins when clicking on the input:file[name="upload-file"]. ... <div id="upload-accepted"> <fieldset> <label for="upload-file">Select a file:</label> <input type="file" name="upload-file" id="upload-file"/> <noscript> <p>Please enable JavaScript to use file uploader.</p> </noscript> </fieldset> <div id="upload-container"> </div> </div> ... <script type="text/javascript"> $(function() { var uploader = new qq.FileUploader({ action: '/file-upload', element: document.getElementById('upload-container'), onSubmit: function(id, filename){...}, onComplete: function(id, fileName, responseJSON){...} }); }); </script> I have tried to add the following on the script but it don't works $("#upload-file").live('change', function(event) { event.preventDefault(); $('.qq-upload-button').trigger('click'); return false; }); Any clues? Thanks in advance!

    Read the article

  • how to return multiple array items using json/jquery

    - by Scarface
    Hey guys, quick question, I have a query that will usually return multiple results from a database, while I know how to return one result, I am not sure how to return multiple in jquery. I just want to take each of the returned results and run them through my prepare function. I have been trying to use 'for' to handle the array of data but I don't think it can work since I am returning different array values. If anyone has any suggestions, I would really appreciate it. JQUERY RETRIEVAL for(i=0; i < json.rows; i++) { $('#users_online').append(online_users(json[i])); $('#online_list-' + count2).fadeIn(1500); } PHP PROCESSING $qryuserscount1="SELECT active_users.username,COUNT(scrusersonline.id) AS rows FROM scrusersonline LEFT JOIN active_users ON scrusersonline.id=active_users.id WHERE topic_id='$topic_id'"; $userscount1=mysql_query($qryuserscount1); while ($row = mysql_fetch_array($userscount1)) { $onlineuser= $row['username']; $rows=$row['rows']; if ($username==$onlineuser){ $str2= "<a href=\"statistics.php?user=$onlineuser\"><div class=\"me\">$onlineuser</div></a>"; } else { $str2= "<b><a href=\"statistics.php?user=$onlineuser\"><div class=\"others\">$onlineuser</div></a></b>"; } $data['rows']=$rows; $data['entry']=$str1.$str2; }

    Read the article

  • Solve the IE select overlap bug

    - by Vincent Robert
    When using IE, you cannot put an absolutely positioned div over a select input element. That's because the select element is considered an ActiveX object and is on top of every HTML element in the page. I already saw people hiding selects when opening a popup div, that leads to pretty bad user experience having controls disappearing. FogBugz actually had a pretty smart solution (before v6) of turning every select into text boxes when a popup was displayed. This solved the bug and tricked the user eye but the behavior was not perfect. Another solution is in FogBugz 6 where they no more use the select element and recoded it everywhere. Last solution I currently use is messing up the IE rendering engine and force it to render the absolutely positioned div as an ActiveX element too, ensuring it can live over a select element. This is achieved by placing an invisible iframe inside the div and styling it with: #MyDiv iframe { position: absolute; z-index: -1; filter: mask(); border: 0; margin: 0; padding: 0; top: 0; left: 0; width: 9999px; height: 9999px; overflow: hidden; } Anyone has a even better solution than this one ? EDIT: The purpose of this question is as much informative as it is a real question. I find the iframe trick to be a good solution but I am still looking for improvement like removing this ugly useless iframe tag that degrade accessibility.

    Read the article

  • Javascript: Collision detection

    - by jack moore
    Hello, could someone please help me to understand how collision detection works in JS? I can't use jQuery or gameQuery - already using prototype - so, I'm looking for something very simple. Not asking for complete solution, just point me to the right direction. Let's say there's: <div id="ball"></div> and <div id="someobject0"></div> Now the ball is moving (any direction). "Someobject"(0-X) is already pre-defined and there's 20-60 of them randomly positioned like this: #someobject {position: absolute; top: RNDpx; left: RNDpx;} I can create an array with "someobject(X)" positions and test collision while the "ball" is moving... Something like: for(var c=0; c<objposArray.length; c++){ ........ and code to check ball's current position vs all objects one by one.... } But I guess this would be a "noob" solution and it looks pretty slow. Is there anything better?

    Read the article

  • Ajax/PHP contact form not able to send mail

    - by Steph
    The funny thing is it did work for one evening. I contacted my host, and they are saying there's no reason it should not be working. I have also attempted to test it in Firebug, but it seemed to be sending. And I specifically put the email address (hosted in my domain) on my email safe list, so that is not the culprit either. Would anyone here take a look at it for me? I'd be so grateful. In the header I have: <script type="text/javascript"> $(document).ready(function() { var options = { target: '#alert' }; $('#contactForm').ajaxForm(options); }); $.fn.clearForm = function() { return this.each(function() { var type = this.type, tag = this.tagName.toLowerCase(); if (tag == 'form') return $(':input',this).clearForm(); if (type == 'text' || type == 'password' || tag == 'textarea') this.value = ''; else if (type == 'checkbox' || type == 'radio') this.checked = false; else if (tag == 'select') this.selectedIndex = -1; }); }; </script> Here is the actual form: <form id="contactForm" method="post" action="sendmail.php"> <fieldset> <p>Email Me</p> <div id="fieldset_container"> <label for="name">Your Name:</label> <input type="text" name="name" id="name" /><br /><br /> <label for="email">Email:</label> <input type="text" name="email" id="email" /><br /><br /> <span style="display:none;"> <label for="last">Honeypot:</label> <input type="text" name="last" value="" id="last" /> </span><br /><br /> <label for="message">Comments &amp; Inquiries:</label> <textarea name="message" id="message" cols="" rows=""></textarea><br/> </div> <div id="submit_button"> <input type="submit" name="submit" id="submit" value="Send It" /> </div> </fieldset> </form> <div class="message"><div id="alert"></div></div> Here is the code from my validating page, sendmail.php: <?php // Who you want to recieve the emails from the form. (Hint: generally you.) $sendto = '[email protected]'; // The subject you'll see in your inbox $subject = 'SH Contact Form'; // Message for the user when he/she doesn't fill in the form correctly. $errormessage = 'There seems to have been a problem. May I suggest...'; // Message for the user when he/she fills in the form correctly. $thanks = "Thanks for the email!"; // Message for the bot when it fills in in at all. $honeypot = "You filled in the honeypot! If you're human, try again!"; // Various messages displayed when the fields are empty. $emptyname = 'Entering your name?'; $emptyemail = 'Entering your email address?'; $emptymessage = 'Entering a message?'; // Various messages displayed when the fields are incorrectly formatted. $alertname = 'Entering your name using only the standard alphabet?'; $alertemail = 'Entering your email in this format: <i>[email protected]</i>?'; $alertmessage = "Making sure you aren't using any parenthesis or other escaping characters in the message? Most URLS are fine though!"; //Setting used variables. $alert = ''; $pass = 0; // Sanitizing the data, kind of done via error messages first. Twice is better! ;-) function clean_var($variable) { $variable = strip_tags(stripslashes(trim(rtrim($variable)))); return $variable; } //The first if for honeypot. if ( empty($_REQUEST['last']) ) { // A bunch of if's for all the fields and the error messages. if ( empty($_REQUEST['name']) ) { $pass = 1; $alert .= "<li>" . $emptyname . "</li>"; } elseif ( ereg( "[][{}()*+?.\\^$|]", $_REQUEST['name'] ) ) { $pass = 1; $alert .= "<li>" . $alertname . "</li>"; } if ( empty($_REQUEST['email']) ) { $pass = 1; $alert .= "<li>" . $emptyemail . "</li>"; } elseif ( !eregi("^[_a-z0-9-]+(.[_a-z0-9-]+)*@[a-z0-9-]+(.[a-z0-9-]+)*(.[a-z]{2,3})$", $_REQUEST['email']) ) { $pass = 1; $alert .= "<li>" . $alertemail . "</li>"; } if ( empty($_REQUEST['message']) ) { $pass = 1; $alert .= "<li>" . $emptymessage . "</li>"; } elseif ( ereg( "[][{}()*+?\\^$|]", $_REQUEST['message'] ) ) { $pass = 1; $alert .= "<li>" . $alertmessage . "</li>"; } //If the user err'd, print the error messages. if ( $pass==1 ) { //This first line is for ajax/javascript, comment it or delete it if this isn't your cup o' tea. echo "<script>$(\".message\").hide(\"slow\").show(\"slow\"); </script>"; echo "<b>" . $errormessage . "</b>"; echo "<ul>"; echo $alert; echo "</ul>"; // If the user didn't err and there is in fact a message, time to email it. } elseif (isset($_REQUEST['message'])) { //Construct the message. $message = "From: " . clean_var($_REQUEST['name']) . "\n"; $message .= "Email: " . clean_var($_REQUEST['email']) . "\n"; $message .= "Message: \n" . clean_var($_REQUEST['message']); $header = 'From:'. clean_var($_REQUEST['email']); //Mail the message - for production mail($sendto, $subject, $message, $header, "[email protected]"); //This is for javascript, echo "<script>$(\".message\").hide(\"slow\").show(\"slow\").animate({opacity: 1.0}, 4000).hide(\"slow\"); $(':input').clearForm() </script>"; echo $thanks; die(); //Echo the email message - for development echo "<br/><br/>" . $message; } //If honeypot is filled, trigger the message that bot likely won't see. } else { echo "<script>$(\".message\").hide(\"slow\").show(\"slow\"); </script>"; echo $honeypot; } ?>

    Read the article

  • o3d javascript uncaught reference error

    - by David Menard
    hey, im new to javascript and am intersted in creating a small o3d script: <!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> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Test Game Website</title> </head> <body> <script type="text/javascript" src="o3djs/base.js"></script> <script type = "text/javascript" id="myscript"> o3djs.require('o3djs.camera'); window.onload = init; function init(){ document.write("jkjewfjnwle"); } </script> <div align="background"> <div id="game_container" style="margin: 0px auto; clear: both; background-image: url('./tmp.png'); width: 800px; height:600px; padding: 0px; background-repeat: no-repeat; padding-top: 1px;"></div> </div> </body> </html> the browser cant seem to find o3djs/base.js in this line <script type="text/javascript" src="o3djs/base.js"></script> and gives me an uncaught referenceerror at this line o3djs.require('o3djs.camera'); Obviously, because it can't find the o3djs/base.js... I have installed the o3d pluggin from google and they say that should be IT ive tried on firefox, ie and chrome thanks

    Read the article

  • Can anyone tell me about a jQuery modal dialog box library that doesn't suck

    - by Ritesh M Nayak
    jQuery based modal dialog boxes are great as long as you do as much as the example tells you to. I need a jQuery based modal dialog box library that has to have the following characteristics: It should be fast, something like the add and link dialog on StackOverflow. Most libraries take an eternity to load the dialog with its fancy effects and stuff. I want to call it using a script. Show a hidden div or a span element inline. MOst of the libraries talk filling an anchor with rel, class and href=#hiddenDiv sort of things. I need to be able to what I want without adding unnecessary attributes to my anchor. Something like this function showDialog(values) { processToChangeDom(values); changeDivTobeDisplayed(); modalDialog.show(); } It should reflect changes I make to the DOM in the hidden Div. I used facebox and found out that it makes a copy of the hidden div and changes to the DOM doesn't reflect on the modal window. I need to be able call the close modal div using javascript and also attach beforeOpen and afterClose handlers to the action. Does anyone have any suggestions? I have already tried facebox, simplemodal and a whole range of libraries, most of them don't support one or the other of these functions I described above.

    Read the article

  • IE6 - too much spacing appearing above h3, how do I get rid of it?

    - by codemonkey613
    Example: http://bit.ly/dfjvmT If you take a look at that URL, you will see an <h3> labeled "Send Us Your Resume". Problem is -- in IE6, it has too much space at the top. It's supposed to be margin-top of 16px, but in IE6, it appears more like 24-30px. I have a reset.css file which has zeroed all margins and paddings, so it's not that. Just checked, both CSS and XHTML are valid. And I notice this spacing error only appears when I put a before this <h3>. Currently, I have <div class="top"></div> which appears before this <h3>. That part takes care of rounded corners for the container. When I remove that <div>, the spacing finally matches in both IE6 and Firefox. Of course, I need to use that <div> for rounded corners. So I'm wondering, what exactly is causing this problem, and is there a way to fix it? Thanks

    Read the article

  • jQuery - Not sure which method to use, closest() and parent() don't work.

    - by Nike
    Hello, again. :) God i feel like i'm spamming stackoverflow, this is my 3rd post for today. Sorry, heh. I even posted a question regarding this before, kind of, but i've changed the code a bit since so i thought it was better to post a new question. $('.pmlist ul li h4 .toggle').click(function() { $(this).closest('.meddel').toggle(250); }); That's what i've got now. The reason why the closest() method isn't working is because the div .meddel is just next to the h4 element. And closest() only crawls right up the DOM tree, ignoring other child elements. Right? parent() works almost the same and doesn't work either. And as i only want to toggle the closest .meddel div in the element, i need something that, yeah justs grabs the nearest one, and not all of them. To clear it up a bit, here's the HTML for one list item: <li class="item"> <h4><a class="toggle">ämne</a><small>2010-04-17 kl 12:54 by <u>nike1</u></small></h4> <div class="meddel"> <span> <img style="max-width: 70%; min-height: 70%;" src="profile-images/nike1.jpg" alt="" /> <a href="account.php?usr=47">nike1</a> </span> <p>text</p> </div> </li> I have several items like that, and if i click one toggle link, i just want the nearest .meddel to be toggled, as mentioned before. Thanks. -Nike

    Read the article

  • html to text with domdocument class

    - by turbod
    How to get a html page source code without htl tags? For example: <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <meta http-equiv="content-language" content="hu"/> <title>this is the page title</title> <meta name="description" content="this is the description" /> <meta name="keywords" content="k1, k2, k3, k4" /> start the body content <!-- <div>this is comment</div> --> <a href="open.php" title="this is title attribute">open</a> End now one noframes tag. <noframes><span>text</span></noframes> <select name="select" id="select"><option>ttttt</option></select> <div class="robots-nocontent"><span>something</span></div> <img src="url.png" alt="this is alt attribute" /> I need this result: this is the page title this is the description k1, k2, k3, k4 start the body content this is title attribute open End now one noframes tag. text ttttt something this is alt attribute I need too the title and the alt attributes. Idea?

    Read the article

  • event.target doesn't work

    - by rdesign
    Hey guys, I've wrote some jquery code with some draggable elements and one droparea. Unfortunately my droparea can't make a difference between various object. Here's my code. <script type="text/javascript"> $(function() { $("#droparea").droppable({ drop: function(event) { var $target = $(event.target); if($target.is("#flyer")) { alert("adasd"); } } }); }); </script> </head> <body> <div id="droparea"></div> <div class="polaroid" id="flyer"> <img src="images/muesliFlyer.png" alt="flyer" /> </div> Without the if it works. But then I can't get the dropped object. Any ideas why my target isn't recognized? thanks a lot.

    Read the article

  • Follow tab's url in jquery ui tabs

    - by Aakash Chakravarthy
    Hello, I have jquery tabs like <ul id="tabsList"> <li><a href="#tab-1">Name 1</a></li> <li><a href="#tab-2">Name 2</a></li> <li><a href="http://www.google.com/">Name 3</a></li> </ul> <div id="tab-1">content 1</div> <div id="tab-2">content 2</div> the first two tabs load the respective divs. But the third one should go to google.com, instead it does nothing. It just adds http://example.com/index.html#ui-tabs-[object Object] to the url. I am developing a wordpress plugin and the admin page needs a tab interface. I tested this in a local server and not working update: i don't want to load google.com inside the page. It should open the webpage in new tab/window like ordinary links do.

    Read the article

< Previous Page | 173 174 175 176 177 178 179 180 181 182 183 184  | Next Page >