Search Results

Search found 24348 results on 974 pages for 'javascript overlay'.

Page 2/974 | < Previous Page | 1 2 3 4 5 6 7 8 9 10 11 12  | Next Page >

  • z-Index overlay in google maps version 3

    - by fredrik
    Hi, I'm trying to get an overlay in google maps api v3 to appear above all markers. But it seems that the google api always put my overlay with lowest z-index priority. Only solution i've found is to iterate up through the DOM tree and manually set z-index to a higher value. Poor solution. I'm adding my a new div to my overlay with: onclick : function (e) { var index = $(e.target).index(), lngLatXYposition = $.view.overlay.getProjection().fromLatLngToDivPixel(this.getPosition()); icon = this.getIcon(), x = lngLatXYposition.x - icon.anchor.x, y = lngLatXYposition.y - icon.anchor.y $('<div>test</div>').css({ left: x, position: 'absolute', top: y + 'px', zIndex: 1000 }).appendTo('.overlay'); } I've tried every property I could think of while creating my overlay. zIndex, zPriority etc. I'm adding my overlay with: $.view.overlay = new GmapOverlay( { map: view.map.gmap }); And GmapOverlay inherits from new google.maps.OverlayView. Any ideas? ..fredrik

    Read the article

  • How do I convert some ugly inline javascript into a function?

    - by Taylor
    I've got a form with various inputs that by default have no value. When a user changes one or more of the inputs all values including the blank ones are used in the URL GET string when submitted. So to clean it up I've got some javascript that removes the inputs before submission. It works well enough but I was wondering how to put this in a js function or tidy it up. Seems a bit messy to have it all clumped in to an onclick. Plus i'm going to be adding more so there will be quite a few. Here's the relevant code. There are 3 seperate lines for 3 seperate inputs. The first part of the line has a value that refers to the inputs ID ("mf","cf","bf","pf") and the second part of the line refers to the parent div ("dmf","dcf", etc). The first part is an example of the input structure... echo "<div id='dmf'><select id='mf' name='mFilter'>"; This part is the submit and js... echo "<input type='submit' value='Apply' onclick='javascript: if (document.getElementById(\"mf\").value==\"\") { document.getElementById(\"dmf\").innerHTML=\"\"; } if (document.getElementById(\"cf\").value==\"\") { document.getElementById(\"dcf\").innerHTML=\"\"; } if (document.getElementById(\"bf\").value==\"\") { document.getElementById(\"dbf\").innerHTML=\"\"; } if (document.getElementById(\"pf\").value==\"\") { document.getElementById(\"dpf\").innerHTML=\"\"; } ' />"; I have pretty much zero javascript knowledge so help turning this in to a neater function or similar would be much appreciated.

    Read the article

  • How to improve performance of map that loads new overlay images

    - by anthonysomerset
    I have inherited a website to maintain that uses a html map overlaying a real map to link specific countries to specific pages. previously it loaded the default map image, then with some javascript it would change the image src to an image with that particular country in a different colour on mouseover and reset the image source back to the original image on mouse out to make maintenance (adding new countries) easier i made the initial map a background image by utilising some CSS for the div tag, and then created new images for each country which only had that countries hightlight so that the images remain fairly small. this works great but theres one issue which is particularly noticeable on slower internet connections when you hover over a country if you dont have the image file in your browser cache or downloaded it wont load the image unless you hover over another country and then back onto the first country - i guess this is due to the image having to manually be downloaded on first hover. My question: is it possible to force the load of these extra images AFTER the page and all the other assets have finished loading so that this behaviour is all but eliminated? the html code for the MAP is as follows: <div class="gtmap"><img id="Image-Maps_6200909211657061" src="<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png" usemap="#Image-Maps_6200909211657061" alt="We offer Guided Motorcycle Tours all around the world" width="615" height="296" /> <map id="_Image-Maps_6200909211657061" name="Image-Maps_6200909211657061"> <area shape="poly" coords="511,134,532,107,542,113,520,141" href="/guided-motorcycle-tours-japan/" alt="Guided Japan Motorcycle Tours" title="Japan" onmouseover="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-japan.png';" onmouseout="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png';" /> <area shape="poly" coords="252,61,266,58,275,64,262,68" href="/guided-motorcycle-tour.php?iceland-motorcycle-adventure-39" alt="Guided Iceland Motorcycle Tours" title="Iceland" onmouseover="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-iceland.png';" onmouseout="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png';" /> <area shape="poly" coords="587,246,597,256,577,279,568,270" href="/guided-motorcycle-tour.php?new-zealand-south-island-adventure-10" alt="New Zealand Guided Motorcycle Tours" title="New Zealand" onmouseover="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-nz.png';" onmouseout="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png';" /> <area shape="poly" coords="418,133,412,145,412,154,421,178,430,180,430,166,443,154,443,145,438,144,433,142,430,138,431,130,430,129,425,128" href="/guided-motorcycle-tours-india/" alt="India Guided Motorcycle Tours" title="India" onmouseover="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-india.png';" onmouseout="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png';" /> <area shape="poly" coords="460,152,466,149,474,165,470,171,466,161" href="/guided-motorcycle-tours-laos/" alt="Laos Guided Motorcycle Tours" title="Laos" onmouseover="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-laos.png';" onmouseout="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png';" /> <area shape="poly" coords="468,179,475,166,468,152,475,152,482,169" href="/guided-motorcycle-tour.php?indochina-motorcycle-adventure-tour-32" onClick="javascript: pageTracker._trackPageview('/internal-links/guided-tours/map/vietnam');" alt="Vietnam Guided Motorcycle Tours" title="Vietnam" onmouseover="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-viet.png';" onmouseout="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png';" /> <area shape="poly" coords="330,239,337,235,347,226,352,233,351,243,344,250,335,253,327,255,323,249,322,242,323,241" href="/guided-motorcycle-tours-southafrica/" alt="South Africa Guided Motorcycle Tours" title="South Africa" onmouseover="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-sa.png';" onmouseout="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png';" /> <area shape="poly" coords="290,77,293,86,298,96,286,102,285,97,285,89,282,84,282,79" href="/guided-motorcycle-tour.php?great-britain-isle-of-man-scotland-wales-uk-18" alt="United Kingdom" title="United Kingdom Guided Motorcycle Tours" onmouseover="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-uk.png';" onmouseout="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png';" /> <area shape="poly" coords="357,118,368,118,369,126,345,129,338,125,338,117,342,115,348,116" href="/guided-motorcycle-tour.php?explore-turkey-adventure-45" alt="Turkey" title="Turkey Guided Motorcycle Tours" onmouseover="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-turkey.png';" onmouseout="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png';" /> <area shape="poly" coords="206,95,193,101,185,101,178,106,165,111,157,109,147,105,134,103,121,103,107,103,96,103,86,104,81,99,77,91,70,83,62,79,60,72,61,64,59,57,60,51,71,50,83,49,95,50,107,54,117,53,129,47,137,36,148,37,163,38,177,44,187,54,195,60,184,72,191,80,200,87" href="/guided-motorcycle-tours-canada/" alt="Guided Canada Motorcycle Tours" title="Canada" onmouseover="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-canada.png';" onmouseout="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png';" /> <area shape="poly" coords="61,75,60,62,60,55,59,44,51,44,43,43,36,42,28,43,23,48,17,51,15,62,19,74,27,79,19,83,16,93,35,83,43,77,50,75,55,75" href="/guided-motorcycle-tours-alaska/" alt="Guided Alaska Motorcycle Tours" title="Alaska" onmouseover="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-alaska.png';" onmouseout="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png';" /> <area shape="poly" coords="82,101,99,101,133,101,148,105,161,110,172,106,187,100,180,113,171,122,165,131,159,149,147,141,137,140,129,147,120,141,112,138,103,137,93,132,86,122,86,112,86,106" href="/guided-motorcycle-tours-usa/" alt="USA Guided Motorcycle Tours" title="USA" onmouseover="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-usa.png';" onmouseout="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png';" /> <area shape="poly" coords="178,225,180,214,175,208,174,204,178,198,174,193,167,192,157,199,158,204,164,211,167,218" href="/guided-motorcycle-tour.php?peru-machu-picchu-adventure-25" alt="Peru Guided Motorcycle Tours" title="Peru" onmouseover="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-peru.png';" onmouseout="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png';" /> <area shape="poly" coords="172,226,169,239,166,256,166,267,164,279,171,277,174,262,175,250,179,234,180,225,176,224" href="/guided-motorcycle-tours-chile/" alt="Guided Chile Motorcycle Tours" title="Chile" onmouseover="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-chile.png';" onmouseout="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png';" /> <area shape="poly" coords="199,260,194,261,187,265,184,276,183,296,170,292,168,282,174,270,174,257,177,245,180,230,190,228,205,237,199,245" href="/guided-motorcycle-tours-argentina/" alt="Guided Argentina Motorcycle Tours" title="Argentina" onmouseover="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-arg.png';" onmouseout="if(document.images) document.getElementById('Image-Maps_6200909211657061').src='<?php echo cdnhttpsCheck(); ?>assets/wmap/a-guided-tours-map-blank.png';" /> </map> </div> The <?php echo cdnhttpsCheck(); ?> is just a site specific function that gets the correct web domain/url from a config file to load resources from CDN where possible (eg all non HTTPS requests) We are loading Jquery at the bottom of the HTML if anybody wonders why it is missing from the code snippet for reference, the page with the map in question is found here: http://www.motoquest.com/guided-motorcycle-tours/

    Read the article

  • Overlay just a part of an external page with jquery

    - by rolando
    Hi, How can i load a part of an external page with jquery overlay? I have an aspx call TipoFactor.aspx wich has a div inside a contentplaceholder like this: <asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server"> <asp:UpdatePanel ID="UpdatePanel1" runat="server"> <ContentTemplate> <br /> <div id="DivGeneral" runat="server" class="tablaPaddingFiveCeleste"> as you can see the "DivGeneral" is the one i want to load into the overlay, wich is defined like this: <a href="TipoFactorSeleccion.aspx" rel="#overlay"> <button type="button"> Pagina Externa</button> </a> <!-- overlayed element --> <div class="apple_overlay" id="overlay"> <!-- the external content is loaded inside this tag --> <div class="contentWrap"> </div> </div> <script type="text/javascript"> $(function() { // if the function argument is given to overlay, // it is assumed to be the onBeforeLoad event listener $("a[rel]").overlay({ expose: 'darkred', effect: 'apple', onBeforeLoad: function() { // grab wrapper element inside content var wrap = this.getContent().find(".contentWrap"); // load the page specified in the trigger wrap.load(this.getTrigger().attr("href")); } }); }); </script> As it is now its loading the entire page into the overlay and that's not good for me cause it inherites from the same masterpage as the other. I need to keep that masterpage because it has some important aplication functionality. What can I do ? Thank you very much.

    Read the article

  • Pluralsight Meet the Author Podcast on Structuring JavaScript Code

    - by dwahlin
    I had the opportunity to talk with Fritz Onion from Pluralsight about one of my recent courses titled Structuring JavaScript Code for one of their Meet the Author podcasts. We talked about why JavaScript patterns are important for building more re-useable and maintainable apps, pros and cons of different patterns, and how to go about picking a pattern as a project is started. The course provides a solid walk-through of converting what I call “Function Spaghetti Code” into more modular code that’s easier to maintain, more re-useable, and less susceptible to naming conflicts. Patterns covered in the course include the Prototype Pattern, Revealing Module Pattern, and Revealing Prototype Pattern along with several other tips and techniques that can be used. Meet the Author:  Dan Wahlin on Structuring JavaScript Code   The transcript from the podcast is shown below: [Fritz]  Hello, this is Fritz Onion with another Pluralsight author interview. Today we’re talking with Dan Wahlin about his new course, Structuring JavaScript Code. Hi, Dan, it’s good to have you with us today. [Dan]  Thanks for having me, Fritz. [Fritz]  So, Dan, your new course, which came out in December of 2011 called Structuring JavaScript Code, goes into several patterns of usage in JavaScript as well as ways of organizing your code and what struck me about it was all the different techniques you described for encapsulating your code. I was wondering if you could give us just a little insight into what your motivation was for creating this course and sort of why you decided to write it and record it. [Dan]  Sure. So, I got started with JavaScript back in the mid 90s. In fact, back in the days when browsers that most people haven’t heard of were out and we had JavaScript but it wasn’t great. I was on a project in the late 90s that was heavy, heavy JavaScript and we pretty much did what I call in the course function spaghetti code where you just have function after function, there’s no rhyme or reason to how those functions are structured, they just kind of flow and it’s a little bit hard to do maintenance on it, you really don’t get a lot of reuse as far as from an object perspective. And so coming from an object-oriented background in JAVA and C#, I wanted to put something together that highlighted kind of the new way if you will of writing JavaScript because most people start out just writing functions and there’s nothing with that, it works, but it’s definitely not a real reusable solution. So the course is really all about how to move from just kind of function after function after function to the world of more encapsulated code and more reusable and hopefully better maintenance in the process. [Fritz]  So I am sure a lot of people have had similar experiences with their JavaScript code and will be looking forward to seeing what types of patterns you’ve put forth. Now, a couple I noticed in your course one is you start off with the prototype pattern. Do you want to describe sort of what problem that solves and how you go about using it within JavaScript? [Dan]  Sure. So, the patterns that are covered such as the prototype pattern and the revealing module pattern just as two examples, you know, show these kind of three things that I harp on throughout the course of encapsulation, better maintenance, reuse, those types of things. The prototype pattern specifically though has a couple kind of pros over some of the other patterns and that is the ability to extend your code without touching source code and what I mean by that is let’s say you’re writing a library that you know either other teammates or other people just out there on the Internet in general are going to be using. With the prototype pattern, you can actually write your code in such a way that we’re leveraging the JavaScript property and by doing that now you can extend my code that I wrote without touching my source code script or you can even override my code and perform some new functionality. Again, without touching my code.  And so you get kind of the benefit of the almost like inheritance or overriding in object oriented languages with this prototype pattern and it makes it kind of attractive that way definitely from a maintenance standpoint because, you know, you don’t want to modify a script I wrote because I might roll out version 2 and now you’d have to track where you change things and it gets a little tricky. So with this you just override those pieces or extend them and get that functionality and that’s kind of some of the benefits that that pattern offers out of the box. [Fritz]  And then the revealing module pattern, how does that differ from the prototype pattern and what problem does that solve differently? [Dan]  Yeah, so the prototype pattern and there’s another one that’s kind of really closely lined with revealing module pattern called the revealing prototype pattern and it also uses the prototype key word but it’s very similar to the one you just asked about the revealing module pattern. [Fritz]  Okay. [Dan]  This is a really popular one out there. In fact, we did a project for Microsoft that was very, very heavy JavaScript. It was an HMTL5 jQuery type app and we use this pattern for most of the structure if you will for the JavaScript code and what it does in a nutshell is allows you to get that encapsulation so you have really a single function wrapper that wraps all your other child functions but it gives you the ability to do public versus private members and this is kind of a sort of debate out there on the web. Some people feel that all JavaScript code should just be directly accessible and others kind of like to be able to hide their, truly their private stuff and a lot of people do that. You just put an underscore in front of your field or your variable name or your function name and that kind of is the defacto way to say hey, this is private. With the revealing module pattern you can do the equivalent of what objective oriented languages do and actually have private members that you literally can’t get to as an external consumer of the JavaScript code and then you can expose only those members that you want to be public. Now, you don’t get the benefit though of the prototype feature, which is I can’t easily extend the revealing module pattern type code if you don’t like something I’m doing, chances are you’re probably going to have to tweak my code to fix that because we’re not leveraging prototyping but in situations where you’re writing apps that are very specific to a given target app, you know, it’s not a library, it’s not going to be used in other apps all over the place, it’s a pattern I actually like a lot, it’s very simple to get going and then if you do like that public/private feature, it’s available to you. [Fritz]  Yeah, that’s interesting. So it’s almost, you can either go private by convention just by using a standard naming convention or you can actually enforce it by using the prototype pattern. [Dan]  Yeah, that’s exactly right. [Fritz]  So one of the things that I know I run across in JavaScript and I’m curious to get your take on is we do have all these different techniques of encapsulation and each one is really quite different when you’re using closures versus simply, you know, referencing member variables and adding them to your objects that the syntax changes with each pattern and the usage changes. So what would you recommend for people starting out in a brand new JavaScript project? Should they all sort of decide beforehand on what patterns they’re going to stick to or do you change it based on what part of the library you’re working on? I know that’s one of the points of confusion in this space. [Dan]  Yeah, it’s a great question. In fact, I just had a company ask me about that. So which one do I pick and, of course, there’s not one answer fits all. [Fritz]  Right. [Dan]  So it really depends what you just said is absolutely in my opinion correct, which is I think as a, especially if you’re on a team or even if you’re just an individual a team of one, you should go through and pick out which pattern for this particular project you think is best. Now if it were me, here’s kind of the way I think of it. If I were writing a let’s say base library that several web apps are going to use or even one, but I know that there’s going to be some pieces that I’m not really sure on right now as I’m writing I and I know people might want to hook in that and have some better extension points, then I would look at either the prototype pattern or the revealing prototype. Now, really just a real quick summation between the two the revealing prototype also gives you that public/private stuff like the revealing module pattern does whereas the prototype pattern does not but both of the prototype patterns do give you the benefit of that extension or that hook capability. So, if I were writing a library that I need people to override things or I’m not even sure what I need them to override, I want them to have that option, I’d probably pick a prototype, one of the prototype patterns. If I’m writing some code that is very unique to the app and it’s kind of a one off for this app which is what I think a lot of people are kind of in that mode as writing custom apps for customers, then my personal preference is the revealing module pattern you could always go with the module pattern as well which is very close but I think the revealing module patterns a little bit cleaner and we go through that in the course and explain kind of the syntax there and the differences. [Fritz]  Great, that makes a lot of sense. [Fritz]  I appreciate you taking the time, Dan, and I hope everyone takes a chance to look at your course and sort of make these decisions for themselves in their next JavaScript project. Dan’s course is, Structuring JavaScript Code and it’s available now in the Pluralsight Library. So, thank you very much, Dan. [Dan]  Thanks for having me again.

    Read the article

  • Weird Overlay draw behaviour when zooming in the MapView [android]

    - by Itsik
    I've extended Overlay and implemented draw() in order to draw some stuff onto the map. When zooming is done through mapController.zoomIn() (called when doubleTapping the map), the overlay is drawn properly onto the map. BUT whenever I zoom in/out with the built in zoom controller, the overlay is not drawn properly and panning the map is needed to get the overlay refreshed.

    Read the article

  • ASP.NET JavaScript Routing for ASP.NET MVC–Constraints

    - by zowens
    If you haven’t had a look at my previous post about ASP.NET routing, go ahead and check it out before you read this post: http://weblogs.asp.net/zowens/archive/2010/12/20/asp-net-mvc-javascript-routing.aspx And the code is here: https://github.com/zowens/ASP.NET-MVC-JavaScript-Routing   Anyways, this post is about routing constraints. A routing constraint is essentially a way for the routing engine to filter out route patterns based on the day from the URL. For example, if I have a route where all the parameters are required, I could use a constraint on the required parameters to say that the parameter is non-empty. Here’s what the constraint would look like: Notice that this is a class that inherits from IRouteConstraint, which is an interface provided by System.Web.Routing. The match method returns true if the value is a match (and can be further processed by the routing rules) or false if it does not match (and the route will be matched further along the route collection). Because routing constraints are so essential to the route matching process, it was important that they be part of my JavaScript routing engine. But the problem is that we need to somehow represent the constraint in JavaScript. I made a design decision early on that you MUST put this constraint into JavaScript to match a route. I didn’t want to have server interaction for the URL generation, like I’ve seen in so many applications. While this is easy to maintain, it causes maintenance issues in my opinion. So the way constraints work in JavaScript is that the constraint as an object type definition is set on the route manager. When a route is created, a new instance of the constraint is created with the specific parameter. In its current form the constraint function MUST return a function that takes the route data and will return true or false. You will see the NotEmpty constraint in a bit. Another piece to the puzzle is that you can have the JavaScript exist as a string in your application that is pulled in when the routing JavaScript code is generated. There is a simple interface, IJavaScriptAddition, that I have added that will be used to output custom JavaScript. Let’s put it all together. Here is the NotEmpty constraint. There’s a few things at work here. The constraint is called “notEmpty” in JavaScript. When you add the constraint to a parameter in your C# code, the route manager generator will look for the JsConstraint attribute to look for the name of the constraint type name and fallback to the class name. For example, if I didn’t apply the “JsConstraint” attribute, the constraint would be called “NotEmpty”. The JavaScript code essentially adds a function to the “constraintTypeDefs” object on the “notEmpty” property (this is how constraints are added to routes). The function returns another function that will be invoked with routing data. Here’s how you would use the NotEmpty constraint in C# and it will work with the JavaScript routing generator. The only catch to using route constraints currently is that the following is not supported: The constraint will work in C# but is not supported by my JavaScript routing engine. (I take pull requests so if you’d like this… go ahead and implement it).   I just wanted to take this post to explain a little bit about the background on constraints. I am looking at expanding the current functionality, but for now this is a good start. Thanks for all the support with the JavaScript router. Keep the feedback coming!

    Read the article

  • Repeated calls with random Javascript append to the URL

    - by cjk
    I keep getting calls to my server where there is random Javascript appended on the end of lots of the calls, e.g.: /UI/Includes/JavaScript/).length)&&e.error( /UI/Includes/JavaScript/,C,!1),a.addEventListener( /UI/Includes/JavaScript/),l=b.createDocumentFragment(),m=b.documentElement,n=m.firstChild,o=b.createElement( /UI/Includes/JavaScript/&&a.getAttributeNode( /UI/Includes/JavaScript/&&a.firstChild.getAttribute( /UI/Includes/JavaScript/).replace(bd, /UI/Includes/JavaScript/)),a.getElementsByTagName( The user agent is always this: Mozilla/4.0+(compatible;+MSIE+6.0;+Windows+NT+5.1;+SV1;+.NET+CLR+2.0.50727) I have jQuery, Modernizr and other JS and originally thought that some browser was messing up it's JS calls, however this particular IP address hasn't requested any images so I'm wondering if it is some kind of attack. Is this a common occurence?

    Read the article

  • How to overlay a div (or any element) over a table row (tr)?

    - by slolife
    I'd like to overlay a div (or any element that'll work) over a table row (tr tag) that happens to have more than one column. I have tried a few methods, which don't seem to work. I've posted my current code below. I do get an overlay, but not directly over just the row. I tried setting the overlay top to $divBottom.css('top'), but that is always 'auto'. So, am I on the right track, or is there a better way of doing it? Utilizing jQuery is fine as you can see. If I am on the right track, how do I get the div placed correctly? Is the offsetTop an offset in the containing element, the table, and I need to do some math? Any other gotchas I'll run into with that? <html> <head> <title>Overlay Tests</title> <style> #rowBottom { outline:red solid 2px } #divBottom { margin:1em; font-size:xx-large; position:relative; } #divOverlay { background-color:Silver; text-align:center; position:absolute; z-index:10000; opacity:0.5; } </style> </head> <body> <p align="center"><a id="lnkDoIt" href="#">Do it!</a></p> <table width="100%" border="0" cellpadding="10" cellspacing="3" style="position:relative"> <tr> <td><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p></td> </tr> <tr id="rowBottom"> <td><div id="divBottom"><p align="center">This is the bottom text</p></div></td> </tr> <tr> <td><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p></td> </tr> </table> <div id="divOverlay" style=""><p>This is the overlay div.</p><p id="info"></p></div> <script src="../includes/javascript/jquery/jquery-1.4.2.js" type="text/javascript"></script> <script type="text/javascript"> $(document).ready(function() { $('#lnkDoIt').click(function() { var $divBottom = $('#rowBottom'); var $divOverlay = $('#divOverlay'); var bottomTop = $divBottom.attr('offsetTop'); var bottomLeft = $divBottom.attr('offsetLeft'); var bottomWidth = $divBottom.css('width'); var bottomHeight = $divBottom.css('height'); $divOverlay.css('top', bottomTop); $divOverlay.css('left', bottomLeft); $divOverlay.css('width', bottomWidth); $divOverlay.css('height', bottomHeight); $('#info').text('Top: ' + bottomTop + ' Left: ' + bottomLeft); }); }); </script> </body> </html>

    Read the article

  • What should be tested in Javascript?

    - by Nathan Hoad
    At work, we've just started on a heavily Javascript based application (actually using Coffeescript, but still), of which I've been implementing an automated test system using JsTestDriver and fabric. We've never written something with this much Javascript, so up until now we've never done any Javascript testing. I'm unsure what exactly we should be testing in our unit tests. We've written JQuery plugins for various things, so it's quite obvious that they should be verified for correctness as much as possible with JsTestDriver, but everyone else in my team seems to think that we should be testing the page level Javascript as well. I don't think we should be testing page level Javascript as unit tests, but instead using a system like Selenium to verify everything works as expected. My main reasoning for this is that at the moment, page level Javascript tests are guaranteed to fail through JsTestDriver, because they're trying to access elements on the DOM that can't possibly exist. So, what should be unit tested in Javascript?

    Read the article

  • Why not use JavaScript but libraries instead?

    - by shareef
    I read this article Unobtrusive JavaScript with jQuery and I noticed these points in the slide page 11 some companies strip JavaScript at the firewall some run the NoScript Firefox extension to protect themselves from common XSS and CSRF attacks many mobile devices ignore JavaScript entirely screen readers do execute JavaScript but accessibility issues mean you may not want them to I did not understand the fourth point. What does it mean? I need your comment and responses on these points. Is not using JavaScript and switching to libraries like jQuery worth it?

    Read the article

  • Looking for a file-system overlay using LD_PRELOAD

    - by ki.lya.online.fr
    Hi, I'm looking for a shared library that is to be loaded using LD_PRELOAD that would modify the view of the filesystem to the client program. Ideally, I'd like to choose the filesystem root (or use / as root) and to overlay the filesystem by renaming filenames. For example, I might want to tell my program to look for /usr/lib/* in /usr/lib32/* instead. Do you know of such a program ? Thanks.

    Read the article

  • What is JavaScript, really?

    - by Lord Loh.
    All this started when I was looking for a way to test my webpage for JavaScript conformance like the W3C HTML Validator. I have not found one yet. So let me know if you know of any... I looked for the official JavaScript page and find ECMA Script. These people have standardized a scripting language (I do not feel like calling it JavaScript anymore!) and called it ECMA-262 (Wikipedia). Their latest work is Edition 5.1 JavaScript was developed my Mozilla Corporation and their last stable version is 1.8.5 (see this) which is based on the ECMA's edition 5.1 The Wikipedia page linked mentions dialects. Mozilla's JavaScript 1.8.5 is listed as a dialect along with JScript 9 (IE) and JavaScript (Chrome's V8[Wiki]) and a lot others. Am I to understand that JavaScript 1.8.5 is a derivative of the ECMA-262 and SpiderMonkey[Wiki] is an engine that runs it? And Chrome has its own dialect and V8 engine is the program that runs it? With all these dialects based off ECMA-262, what I can no longer understand is "What is JavaScript"? Are there any truly cross browser scripting languages? Do the various implementers come together to agree on the dialect cross compatibility? Is this effort ECMA?

    Read the article

  • on hover overlay image in CSS

    - by Juventus
    I need a div with picture bg to overlay an image (with some amount transparency) when hovered on. I need to be able to have one transparent overlay that can be used and reused throughout the site on any image. My first attempt was round-about to say the least. Because I found out you cannot roll-over an invisible div I devised a sandwhich system in which the original image is the first layer, the overlay is the second layer, and the original image is third layer again. This way, when you roll-over, the original image disappears revealing the overlay image over the original image: http://www.nightlylabs.com/uploads/test.html So it works. Kinda. Because of you cannot interact with an visibility:invisible element (why?!) the roll-over flickers unless you rest the cursor on it. Any help? This method is bad so if anyone has a better one please comment.

    Read the article

  • Javascript Implementation Patterns for Server-side MVC Websites

    - by tmo256
    I'm looking for information on common patterns for initializing and executing Javascript page by page in a "traditional" server-side MVC website architecture. A few months ago, my development team began, but abandoned, a major re-architecture of our company's primary web app, including a full front-end redesign. In the process, there was some debate about the architecture of the Javascript in the current version of the site, and whether it fit into a clear, modern design pattern. Now I've returned to the process of overhauling the front end of this and several other MVC websites (Ruby on Rails and MVC.net) to implement a responsive framework (Bootstrap), and in the process will again need to review then revamp and update a lot of Javascript. These web applications are NOT single-page Javascript applications (in fact, we are ripping out a lot of Ajax) or designed to require a Javascript MVC pattern; these apps are basically brochure, catalog and administrative sites that follow a server-side MVC pattern. The vast majority of the Javascript required is behavioral, pre-built plugins (JQuery and Bootstrap, et al) that execute on specific DOM nodes. I'm going to give a very brief (as brief as I can be) run-down of the current architecture only in order to illustrate the scope and type of paradigm I'm talking about. Hopefully, it will help you understand the nature of the patterns I'm looking for, but I'm not looking for commentary on the specifics of this code. What I've done in the past is relatively straight-forward and easy to maintain, but, as mentioned above, some of the other developers don't like the current architecture. Currently, on document ready, I execute whatever global Javascript needs to occur on every page, and then call a page-specific init function to initialize node-specific functionality, retrieving the init method from a JS object. On each page load, something like this will happen: $(document).ready(function(){ $('header').menuAction(); App.pages.executePage('home','show'); //dynamic from framework request object }); And the main App javascript is like App = { usefulGlobalVar: 0, pages: { executePage: function(action, controller) { // if exists, App.pages[action][controller].init() }, home: { show: { init: function() { $('#tabs').tabs(); //et. al }, normalizeName: function() { // dom-specific utility function that // doesn't require a full-blown component/class/module } }, edit: ... }, user_profile: ... } } Any common features and functionality requiring modularization or compotentizing is done as needed with prototyping. For common implementation of plugins, I often extend JQuery, so I can easily initialize a plugin with the same options throughout the site. For example, $('[data-tabs]').myTabs() with this code in a utility javascript file: (function($) { $.fn.myTabs = function() { this.tabs( { //...common options }); }; }) Pointers to articles, books or other discussions would be most welcome. Again, I am looking for a site-wide implementation pattern, NOT a JS MVC framework or general how-tos on creating JS classes or components. Thanks for your help!

    Read the article

  • Advantages of using pure JavaScript over JQuery

    - by Shivan Dragon
    What are the advantages of using Javascript-only versus using JQuery-only? I have limited experience with JavaScript and JQuery coding. I've added bits and snippets of each to HTML pages but I've mostly coded server-side stuff in other languages. I've noticed that while you can theoretically do the same things using either of the two approaches (and of course you can even mix 'em up in the same project) there seems to be a tendency to always start using JQuery from the very beginning no-matter what the project demands are. So I'm simply wondering, are there any punctual benefits to not use JQuery-only but instead to just use plain old JavaScript? I know this looks like a non-question because it can be said about it that "there's no definite answer" or "it can be debated for ever", but I'm actually hoping for punctual answers such as "You can do this in one approach and you cannot do it with the other". ==EDIT== As per scrwtp's comment, I'm not referring just to the DOM Handling part. My question is rather: JQuery is a library. For Javascript. What I find strange about this library as opposed to other libraries for other languages is that in JQyery's case it seems to be designed to be able to use it exclusively and not need to touch Javascript directly. This is as opposed to let's say Hibernate and SQL, where even though the library (or rather framework in this case, but I think the analogy still applies) takes the handle on A LOT of aspects, you still get to use SQL when using it, at least for some fringe cases. However in JQuery & Javascript case, you could do anything you do with Javascript using only JQuery (or at least that's how it seems to me).

    Read the article

  • The importance of Design Patterns with Javascript, NodeJs et al

    - by Lewis
    With Javascript appearing to be the ubiquitous programming language of the web over the next few years, new frameworks popping up every five minutes and event driven programming taking a lead both server and client side: Do you as a Javascript developer consider the traditional Design Patterns as important or less important than they have been with other languages / environments?. Please name the top three design patterns you, as a Javascript developer use regularly and give an example of how they have helped in your Javascript development.

    Read the article

  • How to use javascript functions, defined in some external *.js file in browser's javascript console?

    - by Dmytro Tsiniavsky
    I would like to know is it possible to save some, for example,simplemath.js file with function ADD(a, b) { return a + b; } simple function, run opera's or some other browser's javascript console, include somehow this (simplemath.js) file, call ADD(2, 5), and get a result in console or execute javascript code on current web page and manipulate with it's content. How can I do that? How can I use javascript functions from external files in web-browser's javascript console?

    Read the article

  • Jquery tools Overlay CSS Conflict, Image positioned under the overlay

    - by Ami Mahloof
    First here's what I'm usingh and trying to do: the minimal setup for this effect: flowplayer.org/tools/demos/overlay/index.html then the Apple Leopard Preview Effect: flowplayer.org/tools/demos/overlay/apple.html Now here's the page I'm having the issue with http://gentle-mist-64.heroku.com/pictures My Issue: when I click on an image the picture shows under the overlay and to the right side, This has to be a conflict between my CSS positioning to the the plugin positioning. when I try this on a blank page with no layout, it works just fine. my layout css: body{ background: url('/images/background.jpg'); } #image_stage{ position: relative; top: 30px; margin: auto; margin-top: 75px; background-color: white; width: 900px; height: 520px; } #image_inside_stage { float: left; margin-top: 7px; margin-left: 27px; } #logo{ position: absolute; left: 725px; top: 4px; } #see_through_box { position: absolute; background-color: black; opacity: 0.66; -moz-opacity: 0.66; filter:alpha(opacity=66); width: 665px; height: 432px; margin: 45px; z-index: 99; -moz-border-radius-topleft: 15px; -moz-border-radius-topright: 0; -moz-border-radius-bottomleft: 0; -moz-border-radius-bottomright: 15px; -webkit-border-top-left-radius: 15px; -webkit-border-top-right-radius: 0; -webkit-border-bottom-left-radius: 0; -webkit-border-bottom-right-radius: 15px; } .inner_content{ position: absolute; top: 75px; left: 75px; z-index: 99; color: whitesmoke; } Anyone Please Help, I want this plugin to work, this is so much better then just a light box plugin, I have used the plugin acros my entire website and would like to keep on using it. I Appreciate any input Thanks Ami

    Read the article

  • Can you overlay transparent images in Blackberry Apps?

    - by Greg
    I have a very simple application that has one screen and one button. The main screen has a verticalFieldManager with a BitmapField inside it, and one button beneath the bitmap. I want to be able to overlay another image on top of this when the user clicks a button. The overlay image is a PNG with transparent background, and this is important for design, so I can't use popupscreen or a new screen because the backgrounds are always white by default, and I've heard alpha doesn't really do the trick. I guess what I'm asking is if anyone knows a simple way to... A) take a standard verticalFieldManager and overlay a PNG on top of the inner contents B) overlay a PNG over the screen, no matter the contents The basic functionality of this app was intended to be - show an image. on click, show another overlaid on top. on click again, remove the popup image. I haven't found anything that addresses something like this online, but I have read of people doing similar things that utilize popupscreen and new screens in a way I don't need to do. Hopefully this makes sense. Thanks

    Read the article

  • Javascript click function not working

    - by Nabe
    I need to null the value in text box on click, currently I have written a code as such <div class="keyword_non"> <h1>Keywords : <a class="someClass question_off" title="Keywords "></a></h1> <h2><input type="text" name="kw1" value="one" /></h2> <h2><input type="text" name="kw2" value="two" /></h2> <h2><input type="text" name="kw3" value="three" /></h2> <h2><input type="text" name="kw4" value="four" /></h2> </div> <script type="text/javascript" src="/functions/javascript/custom/non_profit_edit.js"></script> <script type="text/javascript" src="/functions/javascript/jquery-1.7.1.min.js"></script> <script type="text/javascript" src="/functions/javascript/custom/jquery-ui-1.8.7.custom.min.js"></script> Inside non_profit_edit.js i have written as such $(document).ready(function(){ $(".kw1").click(function() { $(".kw1").val(" "); }); $(".kw2").click(function() { $(".kw2").val(" "); }); $(".kw3").click(function() { $(".kw3").val(" "); }); $(".kw4").click(function() { $(".kw4").val(" "); }); }); But write now its not working properly... Is this any browser issues or error in code..

    Read the article

  • JavaScript parser in JavaScript

    - by emk
    I need to add some lightweight syntactic sugar to JavaScript source code, and process it using a JavaScript-based build system. Are there any open source JavaScript parsers written in JavaScript? And are they reasonably fast when run on top of V8 or a similar high-performance JavaScript implementation? Thank you for any pointers you can provide!

    Read the article

  • Can google “see” this custom javascript code which displays links from an external site to mine

    - by webmasters
    I have a javascript code on my site who displays links from another site. This is what I have on my source before: <script language="JavaScript" type="text/javascript">showLink(1);</script> This is what I have copied from my source after the page has loaded: <script language="JavaScript" type="text/javascript">showLink(1);</script><a rel="nofollow" target="_blank" class="anc" href="http://x5.external_site.net/sc/out.php?s=5483&amp;o=http%3A%2F%2Fwww.bluetooth.com">Bluetooth Devices</a> Can google see this link?

    Read the article

< Previous Page | 1 2 3 4 5 6 7 8 9 10 11 12  | Next Page >