Search Results

Search found 818 results on 33 pages for 'onload'.

facebook twitter digg google delicious technorati stumbleupon myspace wordpress linkedin gmail igoogle windows live tumblr viadeo yahoo buzz yahoo mail yahoo bookmarks favorites email print

Page 29/33 | < Previous Page | 25 26 27 28 29 30 31 32 33  | Next Page >

  • Safari Frames Invisible Scrollbar

    - by mobiuschic42
    I'm working on a website that uses not just frames, but frames within frames (ew, I know, but I don't get to choose). It actually works OK most of the time, but I'm running into a problem with some of the frames within frames in Safari (only). Some of the two-deep frames render in Safari with a small space on the right-hand side of the frame - I think it's just the ones with scroll set to "no", but fiddling with the scroll settings hasn't fixed it yet. It basically looks like there should be a scroll bar there, but there isn't. I've been working on this awhile and tried a lot of things: changing the heights of the rows, changing the scroll settings, adding a colls='100%' tag, changing the heights of the contents of the frames, as well as checking to make sure widths are set to 100% throughout. Nothing's fixed it so far. Does any one know what's happening here? Here's the basic gist of the code and some screenshots - please forgive the lack of proper quotes; it still renders and fixing them all in this codebase would be a losing battle: <html> <frameset id=fset frameborder=0 border=0 framespacing=0 onbeforeunload="onAppClosing()" onload="onAppInit()" rows="125px,*,0"> <frame src="navFrame.html" name=ControlPanel marginwidth=0 marginheight=0 frameborder=0 scrolling=no noresize> <frame src="contentFrame.html" name=C marginwidth=0 marginheight=0 frameborder=0 scrolling=no> <frame src="invisiFrame.html" name=PING marginwidth=0 marginheight=0 frameborder=0 noresize> <noframes><body>Tough luck.</center></body></noframes> </frameset></html> Inside that second frame (named "C" and with src of "contentFrame") is this: <HTML> <HEAD><META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=utf-8"></head> <frameset rows="48px,*,28px" border=0 frameborder=0 framespacing=0> <frame src="pageTitle.html" name=Title marginwidth=0 marginheight=0 noresize scrolling=no frameborder=0> <frame src="content.html" name=ScreenBody marginwidth=0 marginheight=0 frameborder=0> <frame src="submitBar.html" name=ContextPanel marginwidth=0 marginheight=0 frameborder=0 scrolling=no noresize> </FRAMESET> </HTML> The frames that are troublesome are the first frame (named "Title" with src of "pageTitle.html") and the last frame (named "ContextPanel" with src of "submitBar.html") both have their widths set to 100% and heights are either 100%, not set, or a value less than or equal to their row height. Here is an image of the problem:

    Read the article

  • How to store result of drag and drop as a image

    - by Jimmy
    I want to take the screenshot of the result of drag and drop, but I don't know how to do. Actually, I found 2 javascript and using HTML5 such as html2canvas and canvas2image. I am now combining them together, but it's still meet some problem with the canvas2image. Please help me solve this problem if you have same experience, thank you a lot. Please help me, I've been stock here for days. Drag and drop code. <script> $(function() { $( "#draggable" ).draggable(); $( "#draggable2" ).draggable(); $( "#droppable" ).droppable({ hoverClass: "ui-state-active", drop: function( event, ui ) { $( this ) .addClass( "ui-state-highlight" ) .find( "p" ) .html( "Dropped!" ); } }); }); </script> Image generation code <script> window.onload = function() { function convertCanvas(strType) { if (strType == "JPEG") var oImg = Canvas2Image.saveAsJPEG(oCanvas, true); if (!oImg) { alert("Sorry, this browser is not capable of saving " + strType + " files!"); return false; } oImg.id = "canvasimage"; oImg.style.border = oCanvas.style.border; oCanvas.parentNode.replaceChild(oImg, oCanvas); } function convertHtml(strType) { $('body').html2canvas(); var queue = html2canvas.Parse(); var canvas = html2canvas.Renderer(queue,{elements:{length:1}}); var img = canvas.toDataURL(); convertCanvas(strType); window.open(img); } document.getElementById("html2canvasbtn").onclick = function() { convertHtml("JPEG"); } } </script> HTML code <body> <h3>Picture:</h3> <div id="draggable"> <img src='http://1.gravatar.com/avatar/1ea64135b09e00ab80fa7596fafbd340? s=50&d=identicon&r=R'> </div> <div id="draggable2"> <img src='http://0.gravatar.com/avatar/2647a7d4b4a7052d66d524701432273b?s=50&d=identicon&r=G'> </div> <div id="dCanvas"> <canvas id="droppable" width="500" height="500" style="border: 2px solid gray" class="ui-widget-header" /> </div> <input type="button" id="bGenImage" value="Generate Image" /> <div id="dOutput"></div> </body>

    Read the article

  • embed a jquery script after jquery is loaded by widget

    - by matthew k
    http://stackoverflow.com/a/6065421 was helpful to see how to confirm jquery has been loaded. my widget will need a class that was written using jquery. may i have some assistance on embedding this other class built using jquery? thank you, below is the snippet from the above link with my code added in the final portion as noted in the code comments: (function(window, document, version, callback) { var j, d; var loaded = false; if (!(j = window.jQuery) || version > j.fn.jquery || callback(j, loaded)) { var script = document.createElement("script"); script.type = "text/javascript"; script.src = "/media/jquery.js"; script.onload = script.onreadystatechange = function() { if (!loaded && (!(d = this.readyState) || d == "loaded" || d == "complete")) { callback((j = window.jQuery).noConflict(1), loaded = true); j(script).remove(); } }; document.documentElement.childNodes[0].appendChild(script) } })(window, document, "1.3", function($, jquery_loaded) { //my code added below var script_tag = document.createElement('script'); script_tag.setAttribute("type","text/javascript"); script_tag.setAttribute("src", "http://mysite.com/widget/slides.jquery.js"); (document.getElementsByTagName("head")[0] || document.documentElement).appendChild(script_tag); $('#slides').slides({}); //this line gives an error. }); right now, i am trying the following based on the response(s) provided to this question (line that throws error is noted with a comment): //this function is called after jquery being embedded has been confirmed. {mysite} placeholder is nonexistent in actual code. function main() { jQuery(document).ready(function($) { var css_link = $("<link>", { rel: "stylesheet", type: "text/css", href: "http://mysite/widget/widget.css" }); css_link.appendTo('head'); $('#crf_widget').after('<div id="crf_widget_container"></div>'); /******* Load HTML *******/ var jsonp_url = "http://mysite/widget.php?callback=?"; $.getJSON(jsonp_url, function(data) { $('#crf_widget_container').html(data); $('#category_sel').change(function(){ alert(this.value); }); $.getScript("http://mysite/widget/slides.jquery.js", function(data, textStatus, jqxhr) { alert(1); //fires ok $('#slides').slides({}); //errors }); }); }); }

    Read the article

  • Chrome extension - Localstorage not working

    - by Bjarki Jonasson
    I'm writing a Chrome extension that uses a content script to modify certain parts of a website. The content script worked fine until I tried to add an options page to my extension. Right now I'm using an options.html file to save user preferences to localstorage, as you can see here: <html> <head><title>Options</title></head> <script type="text/javascript"> function save_options() { var select = document.getElementById("width"); var width = select.children[select.selectedIndex].value; localStorage["site_width"] = width; } function restore_options() { var fwidth = localStorage["site_width"]; if (!fwidth) { return; } var select = document.getElementById("width"); for (var i = 0; i < select.children.length; i++) { var child = select.children[i]; if (child.value == fwidth) { child.selected = "true"; break; } } } </script> <body onload="restore_options()"> Width: <select id="width"> <option value="100%">100%</option> <option value="90%">90%</option> <option value="80%">80%</option> <option value="70%">70%</option> </select> <br> <button onclick="save_options()">Save</button> </body> </html> I also have a background.html file to handle the communication between the content script and the localstorage: <html> <script type="text/javascript"> chrome.extension.onRequest.addListener(function(request, sender, sendResponse) { if (request.method == "siteWidth") sendResponse({status: localStorage["site_width"]}); else sendResponse({}); }); </script> </html> Then there's the actual content script that looks like this: var Width; chrome.extension.sendRequest({method: "siteWidth"}, function(response) { width = response.status; }); None of that code actually works. It looks solid enough to me but I'm not a very experienced programmer so I might be wrong. Could someone explain localstorage to me in layman's terms?

    Read the article

  • [Reloaded] Error while sorting filtered data from a GridView

    - by Bogdan M
    Hello guys, I have an error I cannot solve, on a ASP.NET website. One of its pages - Countries.aspx, has the following controls: a CheckBox called "CheckBoxNAME": < asp:CheckBox ID="CheckBoxNAME" runat="server" Text="Name" /> a TextBox called "TextBoxName": < asp:TextBox ID="TextBoxNAME" runat="server" Width="100%" Wrap="False"> < /asp:TextBox> a SQLDataSource called "SqlDataSourceCOUNTRIES", that selects all records from a Table with 3 columns - ID (Number, PK), NAME (Varchar2(1000)), and POPULATION (Number) called COUNTRIES < asp:SqlDataSource ID="SqlDataSourceCOUNTRIES" runat="server" ConnectionString="< %$ ConnectionStrings:myDB %> " ProviderName="< %$ ConnectionStrings:myDB.ProviderName %> " SelectCommand="SELECT COUNTRIES.ID, COUNTRIES.NAME, COUNTRIES.POPULATION FROM COUNTRIES ORDER BY COUNTRIES.NAME, COUNTRIES.ID"> < /asp:SqlDataSource> a GridView called GridViewCOUNTRIES: < asp:GridView ID="GridViewCOUNTRIES" runat="server" AllowPaging="True" AllowSorting="True" AutoGenerateColumns="False" DataSourceID="SqlDataSourceCOUNTRIES" DataKeyNames="ID" DataMember="DefaultView"> < Columns> < asp:CommandField ShowSelectButton="True" /> < asp:BoundField DataField="ID" HeaderText="Id" SortExpression="ID" /> < asp:BoundField DataField="NAME" HeaderText="Name" SortExpression="NAME" /> < asp:BoundField DataField="POPULATION" HeaderText="Population" SortExpression="POPULATION" /> < /Columns> < /asp:GridView> a Button called ButtonFilter: < asp:Button ID="ButtonFilter" runat="server" Text="Filter" onclick="ButtonFilter_Click"/> This is the onclick event: protected void ButtonFilter_Click(object sender, EventArgs e) { Response.Redirect("Countries.aspx?" + (this.CheckBoxNAME.Checked ? string.Format("NAME={0}", this.TextBoxNAME.Text) : string.Empty)); } Also, this is the main onload event of the page: protected void Page_Load(object sender, EventArgs e) { if (Page.IsPostBack == false) { if (Request.QueryString.Count != 0) { Dictionary parameters = new Dictionary(); string commandTextFormat = string.Empty; if (Request.QueryString["NAME"] != null) { if (commandTextFormat != string.Empty && commandTextFormat.EndsWith("AND") == false) { commandTextFormat += "AND"; } commandTextFormat += " (UPPER(COUNTRIES.NAME) LIKE '%' || :NAME || '%') "; parameters.Add("NAME", Request.QueryString["NAME"].ToString()); } this.SqlDataSourceCOUNTRIES.SelectCommand = string.Format("SELECT COUNTRIES.ID, COUNTRIES.NAME, COUNTRIES.POPULATION FROM COUNTRIES WHERE {0} ORDER BY COUNTRIES.NAME, COUNTRIES.ID", commandTextFormat); foreach (KeyValuePair parameter in parameters) { this.SqlDataSourceCOUNTRIES.SelectParameters.Add(parameter.Key, parameter.Value.ToUpper()); } } } } Basicly, the page displays in the GridViewCOUNTRIES all the records of table COUNTRIES. The scenario is the following: - the user checks the CheckBox; - the user types a value in the TextBox (let's say "ch"); - the user presses the Button; - the page loads displaying only the records that match the filter criteria (in this case, all the countries that have names containing "Ch"); - the user clicks on the header of the column called "Name" in order to sort the data in the GridView Then, I get the following error: ORA-01036: illegal variable name/number. Description: An unhandled exception occurred during the execution of the current web request. Please review the stack trace for more information about the error and where it originated in the code. Exception Details: System.Data.OracleClient.OracleException: ORA-01036: illegal variable name/number Source Error: An unhandled exception was generated during the execution of the current web request. Information regarding the origin and location of the exception can be identified using the exception stack trace below. Any help is greatly appreciated, tnks. PS: I'm using ASP.NET 3.5, under Visual Studio 2008, with an OracleXE database.

    Read the article

  • Flash: How to preload upcoming SWF while current one plays

    - by pthesis
    I have a Flash slideshow that plays SWFs listed in an XML file. I would like to have the upcoming SWF load while the current one displays. I've tried all sorts of combinations of LoadMovie and LoadMovieNum, including creating an empty movie clip, but there's something I'm just not getting. Right now, after making the first round through all the files, it transitions smoothly from slide to slide, but I'd like for it to preload so that it transitions without the "Loading..." screen the first time around. It can be viewed here: slideshow Where should I put the LoadMovie line to load the next file (image[p+1]), and how should it look? function loadXML(loaded) { if (loaded) { xmlNode = this.firstChild; image = []; description = []; total = xmlNode.childNodes.length; for (i=0; i<total; i++) { image[i] = xmlNode.childNodes[i].childNodes[0].firstChild.nodeValue; description[i] = xmlNode.childNodes[i].childNodes[1].firstChild.nodeValue; } firstImage(); } else { content = "file not loaded!"; } } xmlData = new XML(); xmlData.ignoreWhite = true; xmlData.onLoad = loadXML; xmlData.load("xmlfile.xml"); ///////////////////////////////////// back_btn.onRelease = function () { backImage(); }; next_btn.onRelease = function () { nextImage(); }; p = 0; function nextImage() { if (p<(total-1)) { p++; trace(this); _root.mc_loadfile.loadMovie (image[p]); _root.movie_name.text = image[p]; next_btn._visible = true; back_btn._visible = true; if (getBytesLoaded() == getBytesTotal()) slideshow(); } else if (p == (total-1)) { p = 0; firstImage(); } } function backImage() { clearInterval(myInterval); if (p>0) { --p; _root.mc_loadfile.loadMovie (image[p]); _root.movie_name.text = image[p]; next_btn._visible = true; if (p != 0) { back_btn._visible = true; } else { back_btn._visible = false; } slideshow(); } } I'd appreciate any help.

    Read the article

  • how to set a polyline on google maps every time when i click twice(make two markers) on maps,

    - by zjm1126
    this is my code : thanks <!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=5.0,user-scalable=yes"> </head> <body onload="initialize()" onunload="GUnload()"> <style type="text/css"> </style> <div id="map_canvas" style="width: 500px; height: 300px;float:left;"></div> <script src="jquery-1.4.2.js" type="text/javascript"></script> <script src="jquery-ui-1.8rc3.custom.min.js" type="text/javascript"></script> <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=ABQIAAAA-7cuV3vqp7w6zUNiN_F4uBRi_j0U6kJrkFvY4-OX2XYmEAa76BSNz0ifabgugotzJgrxyodPDmheRA&sensor=false"type="text/javascript"></script> <script type="text/javascript"> //********** function initialize() { if (GBrowserIsCompatible()){ //var map = new GMap2(document.getElementById("map_canvas")); //map.setCenter(new GLatLng(39.9493, 116.3975), 13); var map = new GMap2(document.getElementById("map_canvas")); var center=new GLatLng(39.917,116.397); map.setCenter(center, 13); map.addOverlay(new GMarker(new GLatLng(39.917,116.397))); map.enableDrawing() //GEvent.addListener(map, "mouseover", function() { //alert("???????"); //}); var one; aFn=function(y_scale,x_scale){ //************ //function p(){ var bounds = map.getBounds(); var southWest = bounds.getSouthWest(); var northEast = bounds.getNorthEast(); var lngSpan = northEast.lng() - southWest.lng(); var latSpan = northEast.lat() - southWest.lat(); var point = new GLatLng(southWest.lat() + latSpan * (1-y_scale), southWest.lng() + lngSpan * x_scale); if(!one){ map.addOverlay(new GMarker(point)); one=point; }else{ var polyline = new GPolyline([one,point], "#ff0000", 5); map.addOverlay(polyline); one=0; } } //********** //************* } } </script> </body> </html>

    Read the article

  • Adding google.maps.latlng within a loop

    - by Mick Morrison
    I am new to Java Script. I am using it, in combination with Java Server Faces. I want to add some points to define a Polilyne using GoogleMaps Apiv3. My problem is that I can't add a FOR statement to the javascript, because it dumps. If I comment this FOR loop, it also dumps. The dump I am getting is: "javax.servlet.ServletException: null source". Has anyone any suggestion to solve this? Thanks in advance, Emanuel <script type="text/javascript"> function initialize() { var longit = "${dateRange.longitude}" ; var lat = "${dateRange.latitude}" ; var latlng = new google.maps.LatLng(lat, longit); var myOptions = { zoom: 15, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP }; var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); var points = []; var cadena1 = "${dateRange.latArray}" ; var cadena2 = "${dateRange.longArray}" ; var latArray = cadena1.split('?'); var longArray = cadena2.split('?'); /* The code Below is the one that fails */ for (var i=0; i < latArray.length; i++) { points.push(new google.maps.LatLng(latArray[i], longArray[i])); } /* Finish of the error code */ // The Polilyne is created var mapPath = new google.maps.Polyline ({ path: points, strokeColor: "#FF0000", strokeOpacity: 1.0, strokeWeight: 4 }); mapPath.setMap(map); } </script> </head> <body onload="initialize()"> <h:graphicImage url="http://localhost:8080/gps_tracking/faces/resources/images/logo.jpg"> </h:graphicImage> <h1 align="center">Sol-Tech</h1><br /> <hr></hr> <div id="map_canvas" style="width:100%; height:100%"></div> </body>

    Read the article

  • Using JSON Data to Populate a Google Map with Database Objects

    - by MikeH
    I'm revising this question after reading the resources mentioned in the original answers and working through implementing it. I'm using the google maps api to integrate a map into my Rails site. I have a markets model with the following columns: ID, name, address, lat, lng. On my markets/index view, I want to populate a map with all the markets in my markets table. I'm trying to output @markets as json data, and that's where I'm running into problems. I have the basic map displaying, but right now it's just a blank map. I'm following the tutorials very closely, but I can't get the markers to generate dynamically from the json. Any help is much appreciated! Here's my setup: Markets Controller: def index @markets = Market.filter_city(params[:filter]) respond_to do |format| format.html # index.html.erb format.json { render :json => @market} format.xml { render :xml => @market } end end Markets/index view: <head> <script type="text/javascript" src="http://www.google.com/jsapi?key=GOOGLE KEY REDACTED, BUT IT'S THERE" > </script> <script type="text/javascript"> var markets = <%= @markets.to_json %>; </script> <script type="text/javascript" charset="utf-8"> google.load("maps", "2.x"); google.load("jquery", "1.3.2"); </script> </head> <body> <div id="map" style="width:400px; height:300px;"></div> </body> Public/javascripts/application.js: function initialize() { if (GBrowserIsCompatible() && typeof markets != 'undefined') { var map = new GMap2(document.getElementById("map")); map.setCenter(new GLatLng(40.7371, -73.9903), 13); map.addControl(new GLargeMapControl()); function createMarker(latlng, market) { var marker = new GMarker(latlng); var html="<strong>"+market.name+"</strong><br />"+market.address; GEvent.addListener(marker,"click", function() { map.openInfoWindowHtml(latlng, html); }); return marker; } var bounds = new GLatLngBounds; for (var i = 0; i < markets.length; i++) { var latlng=new GLatLng(markets[i].lat,markets[i].lng) bounds.extend(latlng); map.addOverlay(createMarker(latlng, markets[i])); } } } window.onload=initialize; window.onunload=GUnload;

    Read the article

  • Create a timer countdown using hours, minutes & seconds from a future date

    - by Tommy Coffee
    I am using some code I found on the internet that creates a countdown from a certain date. I am trying to edit the code so that it only gives me a countdown from an hour, minute, and second that I specify from a future date. I cannot just have code that counts down from a specified time, I need it to countdown to a specified date in the future. This is important so that if the browser is refreshed the countdown doesn't start over but continues where left off. I will be using cookies so the browser remembers what future date was specified when it was first run. Here is the HTML: <form name="count"> <input type="text" size="69" name="count2"> </form> And here is the javascript: window.onload = function() { //change the text below to reflect your own, var montharray=new Array("Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec") function countdown(yr,m,d){ var theyear=yr; var themonth=m; var theday=d var today=new Date() var todayy=today.getYear() if (todayy < 1000) todayy+=1900; var todaym=today.getMonth() var todayd=today.getDate() var todayh=today.getHours() var todaymin=today.getMinutes() var todaysec=today.getSeconds() var todaystring=montharray[todaym]+" "+todayd+", "+todayy+" "+todayh+":"+todaymin+":"+todaysec futurestring=montharray[m-1]+" "+d+", "+yr var dd=Date.parse(futurestring)-Date.parse(todaystring) var dday=Math.floor(dd/(60*60*1000*24)*1) var dhour=Math.floor((dd%(60*60*1000*24))/(60*60*1000)*1) var dmin=Math.floor(((dd%(60*60*1000*24))%(60*60*1000))/(60*1000)*1) var dsec=Math.floor((((dd%(60*60*1000*24))%(60*60*1000))%(60*1000))/1000*1) if(dday==0&&dhour==0&&dmin==0&&dsec==1){ document.forms.count.count2.value=current return } else document.forms.count.count2.value= dhour+":"+dmin+":"+dsec; setTimeout(function() {countdown(theyear,themonth,theday)},1000) } //enter the count down date using the format year/month/day countdown(2012,12,25) } I am sure there is superfluous code above since I only need an hour, minute, and second that I would like to pass to the countdown() function. The year, month and day is unimportant but as I said this is code I am trying to edit which I found on the internet. Any help would be very appreciated. Thank you!

    Read the article

  • How can I embed a conditional comment for IE with innerHTML?

    - by Samuel Charpentier
    Ok so I want to conditionally add this line of code; <!--[if ! IE]> <embed src="logo.svg" type="image/svg+xml" /> <![endif]--> Using: document.getElementById("logo") .innerHTML='...'; In a if()/else() statement and it don't write it! If i get rid of the selective comment ( <!--[if ! IE]><![endif]-->) and only put the SVG ( <embed src="logo.svg" type="image/svg+xml" /> ) it work! what should I do? I found a way around but i think in the Android browser the thing will pop up twice. here's what I've done ( and its Validated stuff!); <!DOCTYPE html> <html> <head> <META CHARSET="UTF-8"> <title>SVG Test</title> <script type="text/javascript"> //<![CDATA[ onload=function() { var ua = navigator.userAgent.toLowerCase(); var isAndroid = ua.indexOf("android") > -1; //&& ua.indexOf("mobile"); if(isAndroid) { document.getElementById("logo").innerHTML='<img src="fin_palais.png"/>'; } } //]]> </script> </head> <body> <div id="logo"> <!--[if lt IE 9]> <img src="fin_palais.png"/> <![endif]--> <!--[if gte IE 9]><!--> <embed src="fin_palais.svg" type="image/svg+xml" /> <!--<![endif]--> </div> </body>

    Read the article

  • Jetty servlet respons to Ajax always empty

    - by chris
    Hi I try to run a java server on Jetty which should respond to an ajax call. Unfortunately the response seems to be empty when I call it with ajax. When I call http://localhost:8081/?id=something I get an answer. The Java Server: public class Answer extends AbstractHandler { public void handle(String target, Request baseRequest, HttpServletRequest request, HttpServletResponse response) throws IOException, ServletException { String id = request.getParameter("id"); response.setContentType("text/xml"); response.setHeader("Cache-Control", "no-cache"); response.setContentLength(19+id.length()); response.setStatus(HttpServletResponse.SC_OK); response.getWriter().write("<message>"+id+"</message>"); //response.setContentType("text/html;charset=utf-8"); response.flushBuffer(); baseRequest.setHandled(true); } public static void main(String[] args) throws Exception { Server server = new Server(8081); server.setHandler(new Answer()); server.start(); server.join(); } } The js and html: <html> <head> <script> var req; function validate() { var idField = document.getElementById("userid"); var url = "validate?id=" + encodeURIComponent(idField.value); if (typeof XMLHttpRequest != "undefined") { req = new XMLHttpRequest(); } else if (window.ActiveXObject) { req = new ActiveXObject("Microsoft.XMLHTTP"); } req.open("GET", "http://localhost:8081?id=fd", true); req.onreadystatechange = callback; req.send(null); } function callback() { if (req.readyState == 4) { if (req.status == 200) { var message = req.responseXML.getElementsByTagName("message")[0]; document.getElementById("userid").innerHTML = "message.childNodes[0].nodeValue"; } } } </script> </head> <body onload="validate('foobar')"> <div id="userid">hannak</div> </body> </html> I'm actually don't know what I'm doing wrong here. Maybe someone has a good idea. greetings chris

    Read the article

  • Bug in Safari: options.length = 0; not working as expected in Safari 4

    - by Stefan
    This is not a real question, but rather an answer to save some others the hassle of tracking this nasty bug down. I wasted hours finding this out. When using options.length = 0; to reset all options of a select element in safari, you can get mixed results depending on wether you have the Web Inspector open or not. If the web inspector is open you use myElement.options.length = 0; and after that query the options.length(), you might get back 1 instead of 0 (expected) but only if the Web Inspector is open (which is often the case when debugging problem like this). Workaround: Close the Web Inspector or call myElement.options.length = 0; twice like so: myElement.options.length = 0; myElement.options.length = 0; Testcase: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Testcase</title> <script type="text/javascript" language="javascript" charset="utf-8"> function test(el){ var el = document.getElementById("sel"); alert("Before calling options.length=" + el.options.length); el.options.length = 0; alert("After calling options.length=" + el.options.length); } </script> </head> <body onLoad="test();"> <p> Make note of the numbers displayed in the Alert Dialog, then open Web inspector, reload this page and compare the numbers. </p> <select id="sel" multiple> <option label="a----------" value="a"></option> <option label="b----------" value="b"></option> <option label="c----------" value="c"></option> </select> </body> </html>

    Read the article

  • I get an `Cannot read property 'slice' of undefined` message when I use the scrollTo jQuery plugin inside this function

    - by alexchenco
    I'm using the jQuery scrollTo plugin. I get this error in my JS Console: 16827Uncaught TypeError: Cannot read property 'slice' of undefined d.fn.scrollToindex.html.js:16827 jQuery.extend.eachindex.html.js:662 d.fn.scrollToindex.html.js:16827 jQuery.extend.eachindex.html.js:662 jQuery.fn.jQuery.eachindex.html.js:276 d.fn.scrollToindex.html.js:16827 popupPlaceindex.html.js:18034 (anonymous function)index.html.js:17745 jQuery.extend._Deferred.deferred.resolveWithindex.html.js:1018 doneindex.html.js:7247 jQuery.ajaxTransport.send.script.onload.script.onreadystatechange When I place $(".menu").scrollTo( $("li.matched").attr("id"), 800 ); inside it. function popupPlace(dict) { $popup = $('div#dish-popup'); $popup.render(dict,window.dishPopupTemplate); if(typeof(dict.dish) === 'undefined') { $popup.addClass('place-only'); } else { $popup.removeClass('place-only'); } var $place = $('div#dish-popup div.place'); var place_id = dict.place._id; if(liked[place_id]) { $place.addClass('liked'); } else { $place.removeClass('liked'); } if(dict.place.likes) { $place.addClass('has-likes'); } else { $place.addClass('zero-likes'); } var tokens = window.currentSearchTermTokens; var tokenRegex = tokens && new RegExp($.map(tokens, RegExp.escape).join('|'), 'gi'); $.each(dict.place.products, function(n, product) { $product = $('#menu-item-'+product.id); if(liked[place_id+'/'+product.id]) { $product.addClass('liked'); } if(tokens && matchesDish(product, tokens)) { $product.addClass('matched'); $product.highlight(tokenRegex); } else { $product.removeClass('matched'); $product.removeHighlight(); } if(product.likes) { $product.addClass('has-likes'); } else { $product.addClass('zero-likes'); } }); $('#overlay').show(); $('#dish-popup-container').show(); // Scroll to matched dish //$("a#scrolll").attr("href", "#" + $("li.matched").attr("id")); //$("a#scrolll").attr("href", "#" + $("li.matched").attr("id")); //$("a#scrolll").trigger("click"); $(".menu").scrollTo( $("li.matched").attr("id"), 800 ); // Hide dish results on mobile devices to prevent having a blank space at the bottom of the site if (Modernizr.mq('only screen and (max-width: 640px)')) { $('ol.results').hide(); } $(".close-dish-popup").click(function() { $("#overlay").hide(); $("#dish-popup-container").hide(); $('ol.results').show(); changeState({}, ['dish', 'place', 'serp']); }); showPopupMap(dict.place, "dish-popup-map"); } Any suggestion to fix this?

    Read the article

  • Unable to find assembly, C#

    - by PlasmaCube
    So, here's the deal. I've got two ASP.NET applications, both of which use SQLServer Session State management. They also both use the same server. I've got a custom session class in an external DLL, which fully implements serialization, and which both applications have referenced. Each application, in turn, has a class which inherits from the DLL class, and both applications use their own respective classes for their session state. Now, what I was trying to accomplish was that if you wanted to go to the other application, it could look in the session (they all use the same session key) and treat the existing object there as the base (the one from the DLL), extract whatever login info you need, then overwrite the session object with your own. Unfortunately, when the second application attempts to read the session, it seems that it looks for the DLL of the first application, and when it can't find it, it throws an exception. Is there a flaw in my logic? Here's an example: // Global.asax of the 1st app protected void Session_Start(object sender, EventArgs e) { Session.Add( "UserSessionKey", new FirstUserSession()); // FirstUserSession inherits from BaseUserSession } Now the second application: // Global.asax of 2nd app protected void Session_Start(object sender, EventArgs e) { if (Session["UserSessionKey"] != null) { BaseUserSession existing = (BaseUserSession)Session["UserSessionKey"]; SecondUserSession session = new SecondUserSession(); // This also inherits from BaseUserSession session.Authenticated = existing.Authenticated; session.Id = existing.Id; session.Role = existing.Role; Session.Add("UserSessionKey", session); } else { Session.Add("UserSessionKey", new SecondUserSession()); } } Here's the exception stack trace. In this case, "MyCBC" is the real name of the first app, and "ASPTesting" is the second app. [SerializationException: Unable to find assembly 'MyCBC, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null'.] System.Runtime.Serialization.Formatters.Binary.BinaryAssemblyInfo.GetAssembly() +1871092 System.Runtime.Serialization.Formatters.Binary.ObjectReader.GetType(BinaryAssemblyInfo assemblyInfo, String name) +7545734 System.Runtime.Serialization.Formatters.Binary.ObjectMap..ctor(String objectName, String[] memberNames, BinaryTypeEnum[] binaryTypeEnumA, Object[] typeInformationA, Int32[] memberAssemIds, ObjectReader objectReader, Int32 objectId, BinaryAssemblyInfo assemblyInfo, SizedArray assemIdToAssemblyTable) +120 System.Runtime.Serialization.Formatters.Binary.ObjectMap.Create(String name, String[] memberNames, BinaryTypeEnum[] binaryTypeEnumA, Object[] typeInformationA, Int32[] memberAssemIds, ObjectReader objectReader, Int32 objectId, BinaryAssemblyInfo assemblyInfo, SizedArray assemIdToAssemblyTable) +52 System.Runtime.Serialization.Formatters.Binary.__BinaryParser.ReadObjectWithMapTyped(BinaryObjectWithMapTyped record) +190 System.Runtime.Serialization.Formatters.Binary.__BinaryParser.ReadObjectWithMapTyped(BinaryHeaderEnum binaryHeaderEnum) +61 System.Runtime.Serialization.Formatters.Binary.__BinaryParser.Run() +253 System.Runtime.Serialization.Formatters.Binary.ObjectReader.Deserialize(HeaderHandler handler, __BinaryParser serParser, Boolean fCheck, Boolean isCrossAppDomain, IMethodCallMessage methodCallMessage) +168 System.Runtime.Serialization.Formatters.Binary.BinaryFormatter.Deserialize(Stream serializationStream, HeaderHandler handler, Boolean fCheck, Boolean isCrossAppDomain, IMethodCallMessage methodCallMessage) +203 System.Web.Util.AltSerialization.ReadValueFromStream(BinaryReader reader) +788 System.Web.SessionState.SessionStateItemCollection.ReadValueFromStreamWithAssert() +55 System.Web.SessionState.SessionStateItemCollection.DeserializeItem(String name, Boolean check) +281 System.Web.SessionState.SessionStateItemCollection.get_Item(String name) +19 System.Web.SessionState.HttpSessionStateContainer.get_Item(String name) +13 System.Web.SessionState.HttpSessionState.get_Item(String name) +13 ASPTesting._Default.Page_Load(Object sender, EventArgs e) in C:\Documents and Settings\sarsstu\My Documents\Projects\Testing\ASPTesting\ASPTesting\Default.aspx.cs:20 System.Web.Util.CalliHelper.EventArgFunctionCaller(IntPtr fp, Object o, Object t, EventArgs e) +14 System.Web.Util.CalliEventHandlerDelegateProxy.Callback(Object sender, EventArgs e) +35 System.Web.UI.Control.OnLoad(EventArgs e) +99 System.Web.UI.Control.LoadRecursive() +50 System.Web.UI.Page.ProcessRequestMain(Boolean includeStagesBeforeAsyncPoint, Boolean includeStagesAfterAsyncPoint) +627 Thanks to everyone in advance.

    Read the article

  • JavaScript (via Greasemonkey) failing to set "title" attributes on <a> tags

    - by rjray
    I have the following (fairly) simple JavaScript snippet that I have wired into Greasemonkey. It goes through a page, looks for <a> tags whose href points to tinyurl.com, and adds a "title" attribute that identifies the true destination of the link. Much of the important code comes from an older (unsupported) Greasemonkey script that quits working when the inner component that held the XPath implementation changed. My script: (function() { var providers = new Array(); providers['tinyurl.com'] = function(link, fragment) { // This is mostly taken from the (broken due to XPath component // issues) tinyurl_popup_preview script. link.title = "Loading..."; GM_xmlhttpRequest({ method: 'GET', url: 'http://preview.tinyurl.com/' + fragment, onload: function(res) { var re = res.responseText.match("<blockquote><b>(.+)</b></blockquote>"); if (re) { link.title = re[1].replace(/\<br \/\>/g, "").replace(/&amp;/g, "&"); } else { link.title = "Parsing failed..."; } }, onerror: function() { link.title = "Connection failed..."; } }); }; var uriPattern = /(tinyurl\.com)\/([a-zA-Z0-9]+)/; var aTags = document.getElementsByTagName("a"); for (i = 0; i < aTags.length; i++) { var data = aTags[i].href.match(uriPattern); if (data != null && data.length > 1 && data[2] != "preview") { var source = data[1]; var fragment = data[2]; var link = aTags[i]; aTags[i].addEventListener("mouseover", function() { if (link.title == "") { (providers[source])(link, fragment); } }, false); } } })(); (The reason the "providers" associative array is set up the way it is, is so that I can expand this to cover other URL-shortening services as well.) I have verified that all the various branches of code are being reached correctly, in cases where the link being examined does and does not match the pattern. What isn't happening, is any change to the "title" attribute of the anchor tags. I've watched this via Firebug, thrown alert() calls in left and right, and it just never changes. In a previous iteration all expressions of the form: link.title = "..."; had originally been: link.setAttribute("title", "..."); That didn't work, either. I'm no newbie to JavaScript OR Greasemonkey, but this one has me stumped!

    Read the article

  • Relocating html elements with jquery

    - by Steven
    Could someone help me with this code? I'm trying to rearrange figures in a certain div into two columns (a and b) in such a way the two columns are about the same height. I've got insane trying to find the problem in my code and not finding it. It doesn't work for a reason... <body onload="rearrangeImages();"> <div class="images"> <figure> <figcaption>This is the figcaption of this figure. An image is missing for this test.</figcaption> </figure> <figure> <figcaption>This is the figcaption of this figure.</figcaption> </figure> <figure> <figcaption>Another one.</figcaption> </figure> </div> <script> function rearrangeImages() { $('.images').each(function() { $(this).prepend('<div class="column_b"></div>'); $(this).prepend('<div class="column_a"></div>'); $(this).append('<div class="test_div"></div>'); $('figure', this).each(function() { var height_a = $(this).parent().$(".column_a").height(); var height_b = $(this).parent().$(".column_b").height(); if (height_a > height_b) { $(this).parent().$(".column_b").append(this); } else { $(this).parent().$(".column_a").append(this); } $(this).remove(); }); }); } </script> </body> Next I would like to be able to make the last figure not going in any of the columns in case it would make column_b higher than column_a. (pseudocode) if (this is last figure) { //place last figure in test_div to measure its height; if (height_a > height_b + height_of_last_image) { $(this).parent().$(".column_b").append(this); } else { $(this).parent().append(this); } } else { //do the normal stuff see higher }

    Read the article

  • Local Variables take 7x longer to access than global variables?

    - by ItzWarty
    I was trying to benchmark the gain/loss of "caching" math.floor, in hopes that I could make calls faster. Here was the test: <html> <head> <script> window.onload = function() { var startTime = new Date().getTime(); var k = 0; for(var i = 0; i < 1000000; i++) k += Math.floor(9.99); var mathFloorTime = new Date().getTime() - startTime; startTime = new Date().getTime(); window.mfloor = Math.floor; k = 0; for(var i = 0; i < 1000000; i++) k += window.mfloor(9.99); var globalFloorTime = new Date().getTime() - startTime; startTime = new Date().getTime(); var mfloor = Math.floor; k = 0; for(var i = 0; i < 1000000; i++) k += mfloor(9.99); var localFloorTime = new Date().getTime() - startTime; document.getElementById("MathResult").innerHTML = mathFloorTime; document.getElementById("globalResult").innerHTML = globalFloorTime; document.getElementById("localResult").innerHTML = localFloorTime; }; </script> </head> <body> Math.floor: <span id="MathResult"></span>ms <br /> var mathfloor: <span id="globalResult"></span>ms <br /> window.mathfloor: <span id="localResult"></span>ms <br /> </body> </html> My results from the test: [Chromium 5.0.308.0]: Math.floor: 49ms var mathfloor: 271ms window.mathfloor: 40ms [IE 8.0.6001.18702] Math.floor: 703ms var mathfloor: 9890ms [LOL!] window.mathfloor: 375ms [Firefox [Minefield] 3.7a4pre] Math.floor: 42ms var mathfloor: 2257ms window.mathfloor: 60ms [Safari 4.0.4[531.21.10] ] Math.floor: 92ms var mathfloor: 289ms window.mathfloor: 90ms [Opera 10.10 build 1893] Math.floor: 500ms var mathfloor: 843ms window.mathfloor: 360ms [Konqueror 4.3.90 [KDE 4.3.90 [KDE 4.4 RC1]]] Math.floor: 453ms var mathfloor: 563ms window.mathfloor: 312ms The variance is random, of course, but for the most part In all cases [this shows time taken]: [takes longer] mathfloor Math.floor window.mathfloor [is faster] Why is this? In my projects i've been using var mfloor = Math.floor, and according to my not-so-amazing benchmarks, my efforts to "optimize" actually slowed down the script by ALOT... Is there any other way to make my code more "efficient"...? I'm at the stage where i basically need to optimize, so no, this isn't "premature optimization"...

    Read the article

  • How to retrieve an input's value without the browser interpreting html special entities?

    - by CaptainQwyx
    Is there a way in JavaScript or MooTools to retrieve the actual text in the value from an input element without the browser interpreting any html special entites? Please see the example included below. My desired outcome is: <div id="output"> <p>Your text is: <b>[&lt;script&gt;alert('scrubbed');&lt;/script&gt;]</b></p> </div> Note that it works if I type/copy &lt;script&gt;alert('scrubbed');&lt;/script&gt; directly into the text input box, but fails if I insert right after loading the page. <html> <head> <meta http-equiv="Content-type" content="text/html; charset=utf-8"> <title>scrubtest</title> </head> <body id="scrubtest" onload=""> <script type="text/javascript" language="JavaScript" src="/js/mootools-core.js"></script> <input type="text" name="scrubtext" value="&lt;script&gt;alert('scrubbed');&lt;/script&gt;" id="scrubtext"/><br /> <input type="button" value="Insert" onclick="insertText();"/><br /> <input type="button" value="Get via MooTools" onclick="alert($('scrubtext').get('value'));"/><br /> <input type="button" value="Get via JavaScript" onclick="alert(document.getElementById('scrubtext').value);"/><br /> <div id="output"> </div> <script type="text/javascript" charset="utf-8"> function insertText() { var stext = $('scrubtext').get('value'); var result = new Element( 'p', {html: "Your text is: <b>["+stext+"]</b>"} ); result.inject($('output')); } </script> </body> </html>

    Read the article

  • C# Read Byte [] to Image

    - by LucasGuitar
    I have an application which I'm adding pictures and these are automatically converted to binary and stored in a single file. how can I save several images, I keep in an XML file start and size of each set of refente to an image byte. But it has several images in bytes, whenever I try to select a different set of bytes just opening the same image. I would like your help to be able to fix this and open different images. Code //Add Image private void btAddImage_Click(object sender, RoutedEventArgs e) { OpenFileDialog op = new OpenFileDialog(); op.Title = "Selecione a Imagem"; op.Filter = "All supported graphics|*.jpg;*.jpeg;*.png|" + "JPEG (*.jpg;*.jpeg)|*.jpg;*.jpeg|" + "Portable Network Graphic (*.png)|*.png"; if (op.ShowDialog() == true) { imgPatch.Source = new BitmapImage(new Uri(op.FileName)); txtName.Focus(); } } //Convert Image private void btConvertImage_Click(object sender, RoutedEventArgs e) { if (String.IsNullOrEmpty(txtName.Text)) { txtName.Focus(); MessageBox.Show("Preencha o Nome", "Error"); } else { save(ConvertFileToByteArray(op.FileName), txtName.Text); } } //Image to Byte Array private static byte[] ConvertFileToByteArray(String FilePath) { return File.ReadAllBytes(FilePath); } //Save Binary File and XML File public void save(byte[] img, string nome) { FileStream f; long ini, fin = img.Length; if (!File.Exists("Escudos.bcf")) { f = new FileStream("Escudos.bcf", FileMode.Create); ini = 0; } else { f = new FileStream("Escudos.bcf", FileMode.Append); ini = f.Length + 1; bin = new TestBinarySegment(); } bin.LoadAddSave("Escudos.xml", "Brasileiro", nome, ini, fin); BinaryWriter b = new BinaryWriter(f); b.Write(img); b.Close(); f.Dispose(); } //Load Image from Byte private void btLoad_Click(object sender, RoutedEventArgs e) { getImageFromByte(); } //Byte to Image public void getImageFromByte(int start, int length) { using (FileStream fs = new FileStream("Escudos.bcf", FileMode.Open)) { byte[] iba = new byte[fs.Length+1]; fs.Read(iba, start, length); Image image = new Image(); image.Source = BitmapFrame.Create(fs, BitmapCreateOptions.None, BitmapCacheOption.OnLoad); imgPatch2.Source = image.Source; } }

    Read the article

  • ActionScript 2: Event doesn't fire?

    - by Pascal Schuster
    So I have a soundHandler class that's supposed to play sounds and then point back to a function on the timeline when the sound has completed playing. But somehow, only one of the sounds plays when I try it out. EDIT: After that sound plays, nothing happens, even though I have EventHandlers set up that are supposed to do something. Here's the code: import mx.events.EventDispatcher; class soundHandler { private var dispatchEvent:Function; public var addEventListener:Function; public var removeEventListener:Function; var soundToPlay; var soundpath:String; var soundtype:String; var prefix:String; var mcname:String; public function soundHandler(soundpath:String, prefix:String, soundtype:String, mcname:String) { EventDispatcher.initialize(this); _root.createEmptyMovieClip(mcname, 1); this.soundpath = soundpath; this.soundtype = soundtype; this.prefix = prefix; this.mcname = mcname; } function playSound(file, callbackfunc) { _root.soundToPlay = new Sound(_root.mcname); _global.soundCallbackfunc = callbackfunc; _root.soundToPlay.onLoad = function(success:Boolean) { if (success) { _root.soundToPlay.start(); } }; _root.soundToPlay.onSoundComplete = function():Void { trace("Sound Complete: "+this.soundtype+this.prefix+this.file+".mp3"); trace(arguments.caller); dispatchEvent({type:_global.soundCallbackfunc}); trace(this.toString()); trace(this.callbackfunction); }; _root.soundToPlay.loadSound("../sound/"+soundpath+"/"+soundtype+prefix+file+".mp3", true); _root.soundToPlay.stop(); } } Here's the code from the .fla file: var playSounds:soundHandler = new soundHandler("signup", "su", "s", "mcs1"); var file = "000"; playSounds.addEventListener("sixtyseconds", this); playSounds.addEventListener("transition", this); function sixtyseconds() { trace("I am being called! Sixtyseconds"); var phase = 1; var file = random(6); if (file == 0) { file = 1; } if (file<10) { file = "0"+file; } file = phase+file; playSounds.playSound(file, "transition"); } function transition() { trace("this works"); } playSounds.playSound(file, "sixtyseconds"); I'm at a total loss for this one. Have been wasting hours to figure it out already. Any help will be deeply appreciated.

    Read the article

  • Submitting form in php file accessed by Ajax?

    - by dronnoc
    Hi people, I am trying to figure out how to submit a form in a page being accessed by Ajax? here are some code snippets to help demonstrate what i am trying to say. HTML BODY - THIS IS WHAT THE USER WILL SEE. <html> <head> <script language="javascript" src="linktoajaxfile.js"> </head> <body onLoad="gotoPage(0)"> <div id="fillThis"> </div> </body> </html> AJAX FILE var xmlhttp function gotoPage(phase) { xmlhttp=GetXmlHttpObject(); if (xmlhttp==null) { alert ("Your browser does not support AJAX!"); return; } var url="pageofstuffce.php"; url=url+"?stg="+phase; url=url+"&sid="+Math.random(); xmlhttp.onreadystatechange=stateChanged; xmlhttp.open("GET",url,true); xmlhttp.send(null); } function stateChanged() { if (xmlhttp.readyState==4) { document.getElementById("fillThis").innerHTML=xmlhttp.responseText; } } function GetXmlHttpObject() { if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari return new XMLHttpRequest(); } if (window.ActiveXObject) { // code for IE6, IE5 return new ActiveXObject("Microsoft.XMLHTTP"); } return null; } PAGE OF DATA <?php $stage = $_GET['stg']; if($stage == 0) { echo '<a onClick="gotoPage(1)">click me</a>'; } elseif($stage == 1) { <form> <input type="text" name="name"> <input type="submit" name="submit"> </form> } elseif(somehow can reach here) { show data from form. } ?> Can anyone perhaps help me get past the form and display the data in the same page? Also, i have looked around, and i don't think anything around has what i need... correct me if i'm wrong though :) Thanks in advance, and i hope i didn't put in too much detail :) Dronnoc EDIT Forgot to mention what I've tried; I have tried submitting the form to itself (same file) and that destroyed the ajax link, and opened the page. i have also tried just having the button move the page onto another step, but the $_POST variable is empty... i am at a loss, so does anyone else have any ideas?

    Read the article

  • Animating and moving a draggable shape in KineticJS's dragend event

    - by user3712941
    I would like to animate moving a draggable shape to another position after it has been dragged in KineticJS. I would like to animate the movement of the shape over a period of time (for example, over 1 second). For example, I create a draggable shape and save its initial xy coordinates. I register a "dragend" event on this shape. Then, I drag the shape to a new position. When I release the drag, the dragend event is called. In that event function, I want to animate/ease the shape back to its original position. See my JSFiddle for a complete example: DragSample. (function () { //create variables at global scope var layer; var stage; var triangle; var triangleLastX = 190; var triangleLastY = 120; var tween; function initTween() { tween = new Kinetic.Tween({ node: triangle, duration: 1, easing: Kinetic.Easings.EaseInOut, x: 400, y: 200, }); } this.init = function () { layer = new Kinetic.Layer(); stage = new Kinetic.Stage({ container: 'container', width: 800, height: 600 }); triangle = new Kinetic.RegularPolygon({ x: 190, y: 120, sides: 3, radius: 80, fill: '#00D2FF', stroke: 'black', strokeWidth: 4, draggable: true }); triangle.on('dragstart', function () { triangleLastX = triangle.attrs.x; triangleLastY = triangle.attrs.y; }); triangle.on('dragend', function () { tween.play(); stage.draw(); }); layer.add(triangle); stage.add(layer); initTween (); } window.onload = init(); })(); I have tried doing this several ways. The last way I attempted to do this was using Kinetic's Tween(), however, when I play this Tween from the dragend event handler function, it moves the shape back to its original position immediately (i.e. the position when the drag started), then applies the Tween. Is there any way to achieve animating the movement of a draggable shape to its original position (or any other position for that matter) in dragend using KineticJS?

    Read the article

  • jQuery image loop not displaying any images

    - by user1871097
    I'm trying to create a very basic image gallery in jQuery. The goal is to have 3 images fade in and out in a sequential order. So image 1 is displayed, fades to image 2 etc. then the whole thing loops again. My HTML code so far is as follows: <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Slider</title> <style type="text/css"> .slider{ width: 2848px; height: 2136px; overflow: hidden; margin: 30px auto; } .slider img{ width:2848px; height:2136px; display:none; } </style> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script> <script src="Slider2.js"></script> </head> <body onload="Slider2"();> <div class="slider"> <img id="1" src="31.jpg" border="0" alt="city"/> <img id="2" src="2vrtigo2.jpg" border="0" alt="roof"/> <img id="3" src="3.jpg" border="0" alt="sea"/> </div> </body> And the jQuery code looks like this: function Slider2() { var total = $(".slider img").size(); for (i=1; i<=total; i+=1) { $(".slider #"+i).fadeIn(600); $(".slider #"+i).delay(2000).hide; }} A quick syntactical note, I've also tried using i++ in the last argument of the For Loop. The result of this code is a blank, white page. I know some of the HTML is being compiled because the enormous 2848x2136 div creates scroll bars on the browser. If anyone could help me out, that would be greatly appreciated. Obviously I'm relatively new to web programming and would love some insight into why this isn't working. Thanks!

    Read the article

  • Different data for different dates

    - by nsw1475
    I am making a web page which will allow users to input and view data for different dates, and to change the date, there are two buttons, one of which will display the previous day, and one which will show the next day. I know that I can do this by submitting forms and reloading the page every time they press one of these buttons, but I would rather use javascript and not have to submit a form, but I am having troubles getting it to work. Currently, I have the two buttons, and the date stored in a PHP variable, as shown in my code below: <script> function init() { <? $nutrDate = $this->parseDate(date('m/d/Y')); ?> } function nutrPrevDay() { <? $nutrDate = mktime(0, 0, 0, date('m',$nutrDate), date('d',$nutrDate)-1, date('Y',$nutrDate)); ?> alert("<? echo(date("m/d/y", $nutrDate)) ?>"); } function nutrNextDay() { <? $nutrDate = mktime(0, 0, 0, date('m',$nutrDate), date('d',$nutrDate)+1, date('Y',$nutrDate)); ?> } window.onload = init; </script> <p style="text-align:center; font-size:14px; color:#03F"> <button onclick="nutrPrevDay()" style="width:200px" >< Show Previous Day</button> <? echo(date('m/d/Y', $nutrDate)) ?> <button onclick="nutrNextDay()" style="width:200px">Show Next Day ></button> </p> I have the alert in the nutrPrevDay() only as debugging. What happens is when I click on the button, the alert shows that the day is correctly decreased (for example from May 17 to May 16), but only decreases one day, and not one day for every click. Also, I do not know how to make the text on the page (created by the line ) change to display the new date after a button is clicked. So here are my questions: 1) Is it possible to dynamically change data (such as text, and in the future, SQL queries) on a page using javascript without having to reload a page when clicking on a button? 2) If possible, how can I make those changes? 3) How can I fix this so that it will increment and decrement through dates every time a button is clicked?

    Read the article

facebook twitter digg google delicious technorati stumbleupon myspace wordpress linkedin gmail igoogle windows live tumblr viadeo yahoo buzz yahoo mail yahoo bookmarks favorites email print

< Previous Page | 25 26 27 28 29 30 31 32 33  | Next Page >