| |
browse.develop.com
Browse.develop.com is a community that was established to collect and
organize valuable web information. Our technical staff have selected and
indexed information and courses that they feel will help you stay
current on best practices across the SDLC.
|
12 Articles match "Demo","Pages"
| Related DevelopMentor Courses | MORE | | jQuery UI and Windows 8 and Internet Explorer 10 touch screens have enhanced my small demo page here. I recently did a blog post describing how to enable the jQuery UI drag effects. In this post I showed how to get the draggable effect to work on an iPad. While that works just fine it isn’t the end of the story. Microsoft has shipped Windows 8 and Internet Explorer 10 and the jQuery UI draggable effect doesn’t work there as is. The solution Fortunately the solution is a lot simpler and doesn’t require an additional plug-in. It turns out that Internet Explorer 10 has quite a good support for pointer and gesture events. Enjoy! The Problem Solver - Wednesday, October 24, 2012 jQuery UI and touch screens For example take a look at the Draggable demo on an iPad. Try for yourself I have created a small demo page here. I really like using jQuery UI in my web applications. But even though jQuery UI is very well tested there are some potential issues to keep in mind. One of those is using the jQuery UI controls on touch devices like the iPad. With these touch enabled devices becoming more and more popular support is quite important if you don’t know you exact client configuration. And on most cases a touch event also raises a mouse event but not quite always. Enjoy The Problem Solver - Monday, September 17, 2012 Using SignalR for real time data updates If you want to try this I have a live demo on my site where you can test this SignalR style page. Make sure to open the page in multiple browsers, click on a book and hit Save. Maybe Amazon would do something like detect you are staying on the same book page and decided to drop the page and animate the effect while you are reading. In a previous post I showed how easy it is to create a simple chat application using SignalR. So in this blog post I am using a simple CRUD, without the delete part, application to show the power of SignalR. var hub = $.connection.booksHub; The Problem Solver - Wednesday, July 25, 2012 |
39 Articles match "Demo","Pages"
| The Latest from DevelopMentor | MORE | | Creating an #AngularJS Controller So far we have only seen the View part as the HTML used was the view used to render the page to the user. Suppose we want to expand on the simple page from the previous post and turn this into a simple calculator, like in the screenshot below, the controller would be responsible for the calculations and the view would just be about displaying the data and not, like with the previous example, contain the actual calculation. 1: 2: 3: 4: AngularJS Demo. 'In the previous blog post I showed how to get started with a really minimal AngularJS application. " ; 5: $scope. The Problem Solver - Wednesday, April 10, 2013 Creating an AngularJS Controller So far we have only seen the View part as the HTML used was the view used to render the page to the user. Suppose we want to expand on the simple page from the previous post and turn this into a simple calculator, like in the screenshot below, the controller would be responsible for the calculations and the view would just be about displaying the data and not, like with the previous example, contain the actual calculation. 1: 2: 3: 4: AngularJS Demo. Model View Controller AngularJS is an MVC framework. It also responds to events to do things. 1: function DemoCtrl($scope) {. The Problem Solver - Wednesday, April 10, 2013 Getting started with AngularJS 1: 2: 3: 4: AngularJS Demo. In this case I added it to the element so the whole page is an AngularJS application. If you prefer you can add it to a sub section of the page. 1: 2: 3: 4: AngularJS Demo. 'Index: Getting started with AngularJS Creating an AngularJS Controller The #AngularJS $scope is not the MVC Model One of the nicer JavaScript frameworks out there to work with must be AngularJS. Now there are quite a few other ones out there and I have used a number of them but AngularJS seems to be the most structured of them. The complete code listing is below. The Problem Solver - Friday, April 5, 2013 | -
| The Best from DevelopMentor | MORE | - jQuery UI and Windows 8 and Internet Explorer 10 touch screens
have enhanced my small demo page here. I recently did a blog post describing how to enable the jQuery UI drag effects. In this post I showed how to get the draggable effect to work on an iPad. While that works just fine it isn’t the end of the story. Microsoft has shipped Windows 8 and Internet Explorer 10 and the jQuery UI draggable effect doesn’t work there as is. The solution Fortunately the solution is a lot simpler and doesn’t require an additional plug-in. It turns out that Internet Explorer 10 has quite a good support for pointer and gesture events. Enjoy! The Problem Solver - Wednesday, October 24, 2012 - jQuery UI and touch screens
For example take a look at the Draggable demo on an iPad. Try for yourself I have created a small demo page here. I really like using jQuery UI in my web applications. But even though jQuery UI is very well tested there are some potential issues to keep in mind. One of those is using the jQuery UI controls on touch devices like the iPad. With these touch enabled devices becoming more and more popular support is quite important if you don’t know you exact client configuration. And on most cases a touch event also raises a mouse event but not quite always. Enjoy The Problem Solver - Monday, September 17, 2012 - Improve perceived performance of ASP.NET MVC websites with asynchronous partial views
In the sample case, it’s kind of an iGoogle landing page with different items: TODO, news, etc. It turns out that my details and the main page are actually pretty fast. Thus the whole page feels sluggish and slow. seconds seems like an unacceptable page load time. seconds in search page generation time dropped traffic by 20%. So a simple solution would be to break the loading of the slower sections (news & popular in our case) apart from the faster sections in the page. Here is the relevant page section which renders the data synchronously. Michael C. Kennedy's Weblog - Tuesday, November 13, 2012 - HTML5 Video
If you create a page like this: HTML5 Video demo. However when I open the page in Internet Exporer 9 or FireFox we get this: The video element loads the movie poster but it doesn’t start playing. HTML5 Video demo. Video has always been a difficult thing on the web. With HTML5 supporting the element that should become a lot easier right? After all you just add a video element, set the source and you are good to go right? video. {. height: 200px; width: 400px; }. < video poster ="[link]. src ="[link]. controls. So what gives? The solution. video. {. Enjoy! The Problem Solver - Tuesday, December 13, 2011 - Using SignalR for real time data updates
If you want to try this I have a live demo on my site where you can test this SignalR style page. Make sure to open the page in multiple browsers, click on a book and hit Save. Maybe Amazon would do something like detect you are staying on the same book page and decided to drop the page and animate the effect while you are reading. In a previous post I showed how easy it is to create a simple chat application using SignalR. So in this blog post I am using a simple CRUD, without the delete part, application to show the power of SignalR. var hub = $.connection.booksHub; The Problem Solver - Wednesday, July 25, 2012 - HTML 5 and file Drag & Drop
The HTML page I am using is real simple and looks like this. 1: 2: 3: 4: HTML 5 Drag & Drop demo. There is a lot of new goodness in HTML 5 and one of these features is being able to drag a file from the Windows explorer into the browser and handling the drop event using JavaScript. If you are a GMail user you are probably familiar with this as GMail allows users to attach files to emails using this Drag&Drop style. Of course as always not every browser supports the new feature. This works just fine with the current versions of Chrome or FireFox though. 1: $( function () {. The Problem Solver - Thursday, October 13, 2011 - Creating an #AngularJS Controller
So far we have only seen the View part as the HTML used was the view used to render the page to the user. Suppose we want to expand on the simple page from the previous post and turn this into a simple calculator, like in the screenshot below, the controller would be responsible for the calculations and the view would just be about displaying the data and not, like with the previous example, contain the actual calculation. 1: 2: 3: 4: AngularJS Demo. 'In the previous blog post I showed how to get started with a really minimal AngularJS application. " ; 5: $scope. The Problem Solver - Wednesday, April 10, 2013 %>
| | |