satellite navigation - Page 127

Adapting a HTML/CSS dropdown menu to multi-level

- by Adam Nygate

Ive been trying to make the original dropdown into multi level for a site im working on. All of my attempts have failed (. For some reason i can only do "margin-right" to align the elements, and this causes some problems. I think it has something to do with the position attribute. Here is my HTML: <ol id="nav"> <li><a href="index.php">Home</a></li> <li class="dropdown_alignedLeft"> <a href="">Products</a> <ul><li class="dropdown_alignedRight"> <a href="">iPoP</a> <ul style="margin-right:-400px; top:0px;-webkit-border-top-right-radius: 5px;border-top-right-radius: 5px;-moz-border-radius-topright: 5px;"><li><a href="customers.php?category=ipop">iPoP - Network Solutions for Vessels</a></li></ul><li class="dropdown_alignedRight"> <a href="">Cameras</a> <ul style="margin-right:-400px; top:0px;-webkit-border-top-right-radius: 5px;border-top-right-radius: 5px;-moz-border-radius-topright: 5px;"><li><a href="customers.php?category=icam">iCam 501 Ultra - Intrinsically Safe Digital Camera with Flash</a></li></ul><li class="dropdown_alignedRight"> <a href="">BNWAS</a> <ul style="margin-right:-400px; top:0px;-webkit-border-top-right-radius: 5px;border-top-right-radius: 5px;-moz-border-radius-topright: 5px;"><li><a href="customers.php?category=bnwas">BNWAS - Bridge Navigation Watch Alarm System</a></li></ul><li class="dropdown_alignedRight"> <a href="">Lighting</a> <ul style="margin-right:-400px; top:0px;-webkit-border-top-right-radius: 5px;border-top-right-radius: 5px;-moz-border-radius-topright: 5px;"><li><a href="customers.php?category=peli">Peli 2690 - Intrinsically Safe LED Head Lamp</a></li></ul><li class="dropdown_alignedRight"> <a href="">Communication</a> <ul style="margin-right:-400px; top:0px;-webkit-border-top-right-radius: 5px;border-top-right-radius: 5px;-moz-border-radius-topright: 5px;"><li><a href="customers.php?category=handy">Ex-Handy 06 - Intrinsically Safe Cell Phone</a></li></ul> </ul> <li class="dropdown_alignedLeft"> <a href="">Customers</a> <ul> <li><a href="customers.php?category=maritime">Maritime</a></li> <li><a href="customers.php?category=non">Non-Maritime</a></li> <li class="dropdown_lastItem"><a href="customers.php?category=organizations">Regulatory Organizations</a></li> </ul> <li><a href="order.php">Product Enquiry</a></li> <li><a href="contact.php">Contact Us</a></li> <li class="dropdown_alignedLeft"> <a href="">Company</a> <ul>  <li><a href="newsandpr.php?category=News">News</a></li> <li class="dropdown_lastItem"><a href="newsandpr.php?category=Press Release">Press Releases</a></li> </ul> </ol> And my CSS: #nav { float:right; margin:15px 0 0; } #nav li { float:left; } #nav li a { display:block; font-family:"PT Sans","Helvetica Neue",Arial,sans-serif; font-size:16px; text-decoration:none; color:#2B95C8; padding:10px 20px 20px; } .dropdown_alignedLeft,.dropdown_alignedRight { position:relative; } #nav .dropdown_alignedLeft>a,#nav .dropdown_alignedRight>a { background:url(../images/dropdown_arrow_blue.png) no-repeat top right; padding:10px 30px 20px 20px; } #nav .dropdown_alignedLeft:hover>a,#nav .dropdown_alignedRight:hover>a { -moz-border-radius-topleft:5px; -moz-border-radius-topright:5px; -moz-border-radius-bottomright:0; -moz-border-radius-bottomleft:0; -webkit-border-top-left-radius:5px; -webkit-border-top-right-radius:5px; -webkit-border-bottom-right-radius:0; -webkit-border-bottom-left-radius:0; border-top-left-radius:5px; border-top-right-radius:5px; border-bottom-right-radius:0; border-bottom-left-radius:0; color:#FFF; background:#2378A1 url(../images/dropdown_arrow_blue.png) no-repeat bottom right; } .dropdown_alignedLeft ul,.dropdown_alignedRight ul { display:none; } #nav .dropdown_alignedLeft:hover>ul,#nav .dropdown_alignedRight:hover>ul { display:block; z-index:100; position:absolute; top:50px; -moz-border-radius-topleft:0; -moz-border-radius-topright:0; -moz-border-radius-bottomright:5px; -moz-border-radius-bottomleft:5px; -webkit-border-top-left-radius:0; -webkit-border-top-right-radius:0; -webkit-border-bottom-right-radius:5px; -webkit-border-bottom-left-radius:5px; border-top-left-radius:0; border-top-right-radius:0; border-bottom-right-radius:5px; border-bottom-left-radius:5px; background:#2378A1; padding:0 0 6px; } #nav .dropdown_alignedRight:hover>ul { top:50px; right:0; text-align:right; } #nav li ul li { float:none; border-bottom:1px dashed #2B95C8; margin:0 20px; } #nav li ul li.dropdown_innerTitle { border:none; font-family:"Helvetica Neue",Arial,sans-serif; font-size:15px; white-space:nowrap; color:#C8DDE7; margin:10px 20px 0; padding:10px 0; } #nav li ul li.dropdown_lastItem { border:none; } #nav li ul li a { font-family:"Helvetica Neue",Arial,sans-serif; font-size:13px; color:#FFF; white-space:nowrap; padding:10px 0 9px; } #nav>li:hover>a,#nav li .current_page { color:#2378A1; background:url(../images/current_page_arrow_blue.png) no-repeat center bottom; } #nav li ul li a:hover { color: #C8DDE7; } For a live version of the menu, please go here: JSFiddle - Live Menu

Read the article

facescontext.getcurrentinstance returns nullpointerexception

- by mvg

I am creating a Spring based JSF application, where I am getting FacesContext.getCurrentInstance which returns null. Here is my Java code public static ServletContext getServletContext() { return (ServletContext) FacesContext.getCurrentInstance() .getExternalContext().getContext(); } This is the stack trace of my error SEVERE: Exception sending context initialized event to listener instance of class org.springframework.beans.factory.BeanCreationException: Error creating bean with name 'dbSettingsServiceTarget' defined in ServletContext resource [/WEB-INF/applicationContext.xml]: Instantiation of bean failed; nested exception is org.springframework.beans.BeanInstantiationException: Could not instantiate bean class [com.baytalkitec.smartcall.service.impl.DbSettingsServiceImpl]: Constructor threw exception; nested exception is java.lang.NullPointerException at org.springframework.beans.factory.support.AbstractAutowireCapableBeanFactory.instantiateBean(AbstractAutowireCapableBeanFactory.java:883) at org.springframework.beans.factory.support.AbstractAutowireCapableBeanFactory.createBeanInstance(AbstractAutowireCapableBeanFactory.java:839) at org.springframework.beans.factory.support.AbstractAutowireCapableBeanFactory.doCreateBean(AbstractAutowireCapableBeanFactory.java:440) at org.springframework.beans.factory.support.AbstractAutowireCapableBeanFactory$1.run(AbstractAutowireCapableBeanFactory.java:409) at java.security.AccessController.doPrivileged(Native Method) at org.springframework.beans.factory.support.AbstractAutowireCapableBeanFactory.createBean(AbstractAutowireCapableBeanFactory.java:380) at org.springframework.beans.factory.support.AbstractBeanFactory$1.getObject(AbstractBeanFactory.java:264) at org.springframework.beans.factory.support.DefaultSingletonBeanRegistry.getSingleton(DefaultSingletonBeanRegistry.java:221) at org.springframework.beans.factory.support.AbstractBeanFactory.doGetBean(AbstractBeanFactory.java:261) at org.springframework.beans.factory.support.AbstractBeanFactory.getBean(AbstractBeanFactory.java:185) at org.springframework.beans.factory.support.AbstractBeanFactory.getBean(AbstractBeanFactory.java:164) at org.springframework.beans.factory.support.DefaultListableBeanFactory.preInstantiateSingletons(DefaultListableBeanFactory.java:429) at org.springframework.context.support.AbstractApplicationContext.finishBeanFactoryInitialization(AbstractApplicationContext.java:729) at org.springframework.context.support.AbstractApplicationContext.refresh(AbstractApplicationContext.java:381) at org.springframework.web.context.ContextLoader.createWebApplicationContext(ContextLoader.java:255) at org.springframework.web.context.ContextLoader.initWebApplicationContext(ContextLoader.java:199) at org.springframework.web.context.ContextLoaderListener.contextInitialized(ContextLoaderListener.java:45) at org.apache.catalina.core.StandardContext.listenerStart(StandardContext.java:3972) at org.apache.catalina.core.StandardContext.start(StandardContext.java:4467) at org.apache.catalina.core.ContainerBase.start(ContainerBase.java:1045) at org.apache.catalina.core.StandardHost.start(StandardHost.java:785) at org.apache.catalina.core.ContainerBase.start(ContainerBase.java:1045) at org.apache.catalina.core.StandardEngine.start(StandardEngine.java:443) at org.apache.catalina.core.StandardService.start(StandardService.java:519) at org.apache.catalina.core.StandardServer.start(StandardServer.java:710) at org.apache.catalina.startup.Catalina.start(Catalina.java:581) at sun.reflect.NativeMethodAccessorImpl.invoke0(Native Method) at sun.reflect.NativeMethodAccessorImpl.invoke(NativeMethodAccessorImpl.java:39) at sun.reflect.DelegatingMethodAccessorImpl.invoke(DelegatingMethodAccessorImpl.java:25) at java.lang.reflect.Method.invoke(Method.java:597) at org.apache.catalina.startup.Bootstrap.start(Bootstrap.java:289) at org.apache.catalina.startup.Bootstrap.main(Bootstrap.java:414) Caused by: org.springframework.beans.BeanInstantiationException: Could not instantiate bean class [com.baytalkitec.smartcall.service.impl.DbSettingsServiceImpl]: Constructor threw exception; nested exception is java.lang.NullPointerException at org.springframework.beans.BeanUtils.instantiateClass(BeanUtils.java:115) at org.springframework.beans.factory.support.SimpleInstantiationStrategy.instantiate(SimpleInstantiationStrategy.java:61) at org.springframework.beans.factory.support.AbstractAutowireCapableBeanFactory.instantiateBean(AbstractAutowireCapableBeanFactory.java:877) ... 31 more Caused by: java.lang.NullPointerException at com.smartcall.util.FacesUtil.getServletContext(FacesUtil.java:21) at com.smartcall.util.SpringApplicationContextUtil.init(SpringApplicationContextUtil.java:21) at com.smartcall.util.SpringApplicationContextUtil.<init>(SpringApplicationContextUtil.java:16) at com.smartcall.service.impl.DbSettingsServiceImpl.init(DbSettingsServiceImpl.java:17) at com.smartcall.service.impl.DbSettingsServiceImpl.<init>(DbSettingsServiceImpl.java:12) at sun.reflect.NativeConstructorAccessorImpl.newInstance0(Native Method) at sun.reflect.NativeConstructorAccessorImpl.newInstance(NativeConstructorAccessorImpl.java:39) at sun.reflect.DelegatingConstructorAccessorImpl.newInstance(DelegatingConstructorAccessorImpl.java:27) at java.lang.reflect.Constructor.newInstance(Constructor.java:513) at org.springframework.beans.BeanUtils.instantiateClass(BeanUtils.java:100) ... 33 more and hence due to this error Server console in Eclipse reports that application failed to startup due to previous errors My web.xml file <?xml version="1.0" encoding="UTF-8"?> <web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd" id="WebApp_ID" version="2.5"> <display-name>smartcall2.0</display-name> <context-param> <param-name>javax.faces.STATE_SAVING_METHOD</param-name> <param-value>server</param-value> </context-param> <context-param> <param-name>javax.faces.CONFIG_FILES</param-name> <param-value> /WEB-INF/faces-config.xml,/WEB-INF/faces-managed-bean.xml,/WEB-INF/faces-navigation.xml </param-value> </context-param> <listener> <listener-class> com.sun.faces.config.ConfigureListener </listener-class> </listener> <listener> <listener-class> org.springframework.web.context.ContextLoaderListener </listener-class> </listener> <filter> <display-name>RichFaces Filter</display-name> <filter-name>richfaces</filter-name> <filter-class>org.ajax4jsf.Filter</filter-class> </filter> <filter-mapping> <filter-name>richfaces</filter-name> <servlet-name>Faces Servlet</servlet-name> <dispatcher>REQUEST</dispatcher> <dispatcher>FORWARD</dispatcher> <dispatcher>INCLUDE</dispatcher> </filter-mapping> <servlet> <servlet-name>Faces Servlet</servlet-name> <servlet-class>javax.faces.webapp.FacesServlet</servlet-class> <load-on-startup>1</load-on-startup> </servlet> <context-param> <param-name>javax.faces.DEFAULT_SUFFIX</param-name> <param-value>.xhtml</param-value> </context-param> <servlet-mapping> <servlet-name>Faces Servlet</servlet-name> <url-pattern>*.jsf</url-pattern> </servlet-mapping> <session-config> <session-timeout>180</session-timeout> </session-config> <welcome-file-list> <welcome-file>index.html</welcome-file> <welcome-file>index.htm</welcome-file> <welcome-file>index.jsp</welcome-file> <welcome-file>default.html</welcome-file> <welcome-file>default.htm</welcome-file> <welcome-file>default.jsp</welcome-file> </welcome-file-list> I am not clear whether this error belongs to Spring or JSF or Eclipse. I am using Eclipse Galileo, JSF 1.2,Spring 3 Please help Thanks in advance

Read the article

C# Persistent WebClient

- by Nullstr1ng

I have a class written in C# (Windows Forms) It's a WebClient class which I intent to use in some website and for Logging In and navigation. Here's the complete class pastebin.com (the class has 197 lines so I just use pastebin. Sorry if I made a little bit harder for you to read the class, also below this post) The problem is, am not sure why it's not persistent .. I was able to log in, but when I navigate to other page (without leaving the domain), I was thrown back to log in page. Can you help me solving this problem? one issue though is, the site I was trying to connect is "HTTPS" protocol. I have not yet tested this on just a regular HTTP. Thank you in advance. /* * Web Client v1.2 * --------------- * Date: 12/17/2010 * author: Jayson Ragasa */ using System; using System.Collections; using System.Collections.Specialized; using System.Collections.Generic; using System.Text; using System.IO; using System.Net; using System.Web; namespace Nullstring.Modules.WebClient { public class WebClientLibrary { #region vars string _method = string.Empty; ArrayList _params; CookieContainer cookieko; HttpWebRequest req = null; HttpWebResponse resp = null; Uri uri = null; #endregion #region properties public string Method { set { _method = value; } } #endregion #region constructor public WebClientLibrary() { _method = "GET"; _params = new ArrayList(); cookieko = new CookieContainer(); } #endregion #region methods public void ClearParameter() { _params.Clear(); } public void AddParameter(string key, string value) { _params.Add(string.Format("{0}={1}", WebTools.URLEncodeString(key), WebTools.URLEncodeString(value))); } public string GetResponse(string URL) { StringBuilder response = new StringBuilder(); #region create web request { uri = new Uri(URL); req = (HttpWebRequest)WebRequest.Create(URL); req.Method = "GET"; req.GetLifetimeService(); } #endregion #region get web response { resp = (HttpWebResponse)req.GetResponse(); Stream resStream = resp.GetResponseStream(); int bytesReceived = 0; string tempString = null; int count = 0; byte[] buf = new byte[8192]; do { count = resStream.Read(buf, 0, buf.Length); if (count != 0) { bytesReceived += count; tempString = Encoding.UTF8.GetString(buf, 0, count); response.Append(tempString); } } while (count > 0); } #endregion return response.ToString(); } public string GetResponse(string URL, bool HasParams) { StringBuilder response = new StringBuilder(); #region create web request { uri = new Uri(URL); req = (HttpWebRequest)WebRequest.Create(URL); req.MaximumAutomaticRedirections = 20; req.AllowAutoRedirect = true; req.Method = this._method; req.Accept = "text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8"; req.KeepAlive = true; req.CookieContainer = this.cookieko; req.UserAgent = "Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10_5_8; en-US) AppleWebKit/534.10 (KHTML, like Gecko) Chrome/8.0.552.224 Safari/534.10"; } #endregion #region build post data { if (HasParams) { if (this._method.ToUpper() == "POST") { string Parameters = String.Join("&", (String[])this._params.ToArray(typeof(string))); UTF8Encoding encoding = new UTF8Encoding(); byte[] loginDataBytes = encoding.GetBytes(Parameters); req.ContentType = "application/x-www-form-urlencoded"; req.ContentLength = loginDataBytes.Length; Stream stream = req.GetRequestStream(); stream.Write(loginDataBytes, 0, loginDataBytes.Length); stream.Close(); } } } #endregion #region get web response { resp = (HttpWebResponse)req.GetResponse(); Stream resStream = resp.GetResponseStream(); int bytesReceived = 0; string tempString = null; int count = 0; byte[] buf = new byte[8192]; do { count = resStream.Read(buf, 0, buf.Length); if (count != 0) { bytesReceived += count; tempString = Encoding.UTF8.GetString(buf, 0, count); response.Append(tempString); } } while (count > 0); } #endregion return response.ToString(); } #endregion } public class WebTools { public static string EncodeString(string str) { return HttpUtility.HtmlEncode(str); } public static string DecodeString(string str) { return HttpUtility.HtmlDecode(str); } public static string URLEncodeString(string str) { return HttpUtility.UrlEncode(str); } public static string URLDecodeString(string str) { return HttpUtility.UrlDecode(str); } } } UPDATE Dec 22GetResponse overload public string GetResponse(string URL) { StringBuilder response = new StringBuilder(); #region create web request { //uri = new Uri(URL); req = (HttpWebRequest)WebRequest.Create(URL); req.Method = "GET"; req.CookieContainer = this.cookieko; } #endregion #region get web response { resp = (HttpWebResponse)req.GetResponse(); Stream resStream = resp.GetResponseStream(); int bytesReceived = 0; string tempString = null; int count = 0; byte[] buf = new byte[8192]; do { count = resStream.Read(buf, 0, buf.Length); if (count != 0) { bytesReceived += count; tempString = Encoding.UTF8.GetString(buf, 0, count); response.Append(tempString); } } while (count 0); } #endregion return response.ToString(); } But still I got thrown back to login page. UPDATE: Dec 23 I tried listing the cookie and here's what I get at first, I have to login to a webform and this I have this Cookie JSESSIONID=368C0AC47305282CBCE7A566567D2942 then I navigated to another page (but on the same domain) I got a different Cooke? JSESSIONID=9FA2D64DA7669155B9120790B40A592C What went wrong? I use the code updated last Dec 22

Read the article

Unknown Space between 2 Container Divs

- by Paul

Im trying to determine why there would be space between 2 Containing Divs as shown, and I would appreciate any insight as to why this is occurring: The unknown space occurs between the mid-feature div (olive) and bottom-wrap div (orange) I have no heights set anywhere. I would like to see the orange div up against the olive div just above it. I can post all of the CSS, or you can FireBug this: www.davincispainting.com Here is all of the CSS: *{ margin:0; padding:0 } body { /*background: url("/images/blueback5.jpg") repeat-x scroll 0 0 transparent;*/ background-color: #9EB0C8; font-family: Arial,Helvetica,sans-serif; font-size: 62.5%; } #top-wrap { height: 126px; width: 940px; /*background-color: Yellow;*/ margin: 5px 0 0 0; } #head-logo { background: url("/images/logo3.png") no-repeat scroll 0 0 transparent; /*background-color: Green;*/ height: 126px; width: 214px; margin: 0px 0 0 58px; position: absolute; z-index: 100; } #submenu1 { border: 0 solid #000000; color: #FFFFFF; /*background-color:Green;*/ font-family: Arial,Impact,Impact5,Charcoal6,sans-serif; font-size: 1.6em; height: 35px; width: 155px; /*padding: 10px 0 0;*/ margin: 7px 0 0 774px; position: absolute; } #submenu2 { /*border: 0 solid #000000;*/ color: #FFFFFF; /*background-color:Blue;*/ font-family: Arial,Impact,Impact5,Charcoal6,sans-serif; font-size: 1.8em; text-align: right; height: 20px; width: 114px; margin: 30px 0 0 818px; /*padding: 5px 0 0;*/ } a.contact { background-image: url("/images/RapidButton2.png"); /*border: 1px solid #CCCCCC;*/ /*clear: both;*/ /*color: #FFFFFF;*/ display: block; font-size: 11px; /*margin-bottom: 1px;*/ /*padding: 3px 5px;*/ text-align: center; width: 165px; height: 27px; } a.contact:hover { background-image: url("/images/RapidButtonHov2.png"); } #navigation-primary { margin: 12px 0 0 276px; position: absolute; } #global-wrap { margin: 0 auto; text-align: left; width: 880px; overflow: hidden; } #global-inner { background: url("/images/main_bg.gif") repeat-y scroll 0 0 #E4EAEF; font-family: Arial; font-size: 1.2em; margin: 15px 0 55px 0; overflow: hidden; text-align: left; width: 880px; } #global-inner .topleft { background: url("/images/main_left_top_corner2.jpg") no-repeat scroll left top transparent; float: left; height: 9px; width: 9px; } #global-inner .topright { background: url("/images/main_right_top_corner2.jpg") no-repeat scroll right top transparent; float: right; height: 9px; width: 9px; } #global-inner .bottomleft { background: url("/images/main_left_bottom_corner.jpg") no-repeat scroll left bottom transparent; float: left; height: 9px; margin-top: -8px; /*margin: 776px 0 0 0;*/ width: 9px; } #global-inner .bottomright { background: url("/images/main_right_bottom_corner.jpg") no-repeat scroll right bottom transparent; float: right; height: 9px; margin-top: -8px; /*margin: 776px 0 0 0;*/ width: 9px; } #top-feature { height:330px; width: 848px; margin: 12px 0 0 16px; background: #E4EAEF; /*background: orange;*/ /*padding: 10px 0 0 10px;*/ position: absolute; text-align: left; } .slideshow { height: 330px; width: 848px; margin: 0 0 0 0; /*background: blue;*/ position: absolute; } #mid-feature { margin:350px 0 0 16px; width:848px; height:318px; background-color:Olive; position:relative; overflow:hidden; } #mid-featureleft { height:318px; width:552px; /*background-color:Purple;*/ float:left; position:relative; } #mid-featureright { height:318px; width:296px; background-color:#B9C1CC; /*background-color: red;*/ float:left; position: relative; } #mid-featureleft h1 { color: #FF0000; font-family: Arial,Helvetica,sans-serif; font-size: 2.1em; } #mid-featureleft .contentbox { padding:7px 7px 7px 7px; } #mid-featureleft p { color: #0C2A55; margin:0px 0 11px 0px; /*font-style:normal;*/ /*width: 97%;*/ /*font-size: .5em;*/ font-size: 12px; } #bottom-wrap { height:60px; width: 868px; margin: auto 0 0 6px; background:orange; position: relative; } #copyright { float: left; /*background-color:Teal;*/ width: 260px; height: 60px; text-align: left; position: absolute; margin:0 0 0 6px; } #bottom-logos { height:60px; width:596px; margin:0 0 0 267px; background: url("/images/logos2.png") no-repeat scroll 0 0 transparent; /*background-color:red;*/ position:absolute; }

Read the article

A free standing ASP.NET Pager Web Control

- by Rick Strahl

Paging in ASP.NET has been relatively easy with stock controls supporting basic paging functionality. However, recently I built an MVC application and one of the things I ran into was that I HAD TO build manual paging support into a few of my pages. Dealing with list controls and rendering markup is easy enough, but doing paging is a little more involved. I ended up with a small but flexible component that can be dropped anywhere. As it turns out the task of creating a semi-generic Pager control for MVC was fairly easily. Now I’m back to working in Web Forms and thought to myself that the way I created the pager in MVC actually would also work in ASP.NET – in fact quite a bit easier since the whole thing can be conveniently wrapped up into an easily reusable control. A standalone pager would provider easier reuse in various pages and a more consistent pager display regardless of what kind of 'control’ the pager is associated with. Why a Pager Control? At first blush it might sound silly to create a new pager control – after all Web Forms has pretty decent paging support, doesn’t it? Well, sort of. Yes the GridView control has automatic paging built in and the ListView control has the related DataPager control. The built in ASP.NET paging has several issues though: Postback and JavaScript requirements If you look at paging links in ASP.NET they are always postback links with javascript:__doPostback() calls that go back to the server. While that works fine and actually has some benefit like the fact that paging saves changes to the page and post them back, it’s not very SEO friendly. Basically if you use javascript based navigation nosearch engine will follow the paging links which effectively cuts off list content on the first page. The DataPager control does support GET based links via the QueryStringParameter property, but the control is effectively tied to the ListView control (which is the only control that implements IPageableItemContainer). DataSource Controls required for Efficient Data Paging Retrieval The only way you can get paging to work efficiently where only the few records you display on the page are queried for and retrieved from the database you have to use a DataSource control - only the Linq and Entity DataSource controls support this natively. While you can retrieve this data yourself manually, there’s no way to just assign the page number and render the pager based on this custom subset. Other than that default paging requires a full resultset for ASP.NET to filter the data and display only a subset which can be very resource intensive and wasteful if you’re dealing with largish resultsets (although I’m a firm believer in returning actually usable sets :-}). If you use your own business layer that doesn’t fit an ObjectDataSource you’re SOL. That’s a real shame too because with LINQ based querying it’s real easy to retrieve a subset of data that is just the data you want to display but the native Pager functionality doesn’t support just setting properties to display just the subset AFAIK. DataPager is not Free Standing The DataPager control is the closest thing to a decent Pager implementation that ASP.NET has, but alas it’s not a free standing component – it works off a related control and the only one that it effectively supports from the stock ASP.NET controls is the ListView control. This means you can’t use the same data pager formatting for a grid and a list view or vice versa and you’re always tied to the control. Paging Events In order to handle paging you have to deal with paging events. The events fire at specific time instances in the page pipeline and because of this you often have to handle data binding in a way to work around the paging events or else end up double binding your data sources based on paging. Yuk. Styling The GridView pager is a royal pain to beat into submission for styled rendering. The DataPager control has many more options and template layout and it renders somewhat cleaner, but it too is not exactly easy to get a decent display for. Not a Generic Solution The problem with the ASP.NET controls too is that it’s not generic. GridView, DataGrid use their own internal paging, ListView can use a DataPager and if you want to manually create data layout – well you’re on your own. IOW, depending on what you use you likely have very different looking Paging experiences. So, I figured I’ve struggled with this once too many and finally sat down and built a Pager control. The Pager Control My goal was to create a totally free standing control that has no dependencies on other controls and certainly no requirements for using DataSource controls. The idea is that you should be able to use this pager control without any sort of data requirements at all – you should just be able to set properties and be able to display a pager. The Pager control I ended up with has the following features: Completely free standing Pager control – no control or data dependencies Complete manual control – Pager can render without any data dependency Easy to use: Only need to set PageSize, ActivePage and TotalItems Supports optional filtering of IQueryable for efficient queries and Pager rendering Supports optional full set filtering of IEnumerable<T> and DataTable Page links are plain HTTP GET href Links Control automatically picks up Page links on the URL and assigns them (automatic page detection no page index changing events to hookup) Full CSS Styling support On the downside there’s no templating support for the control so the layout of the pager is relatively fixed. All elements however are stylable and there are options to control the text, and layout options such as whether to display first and last pages and the previous/next buttons and so on. To give you an idea what the pager looks like, here are two differently styled examples (all via CSS): The markup for these two pagers looks like this: <ww:Pager runat="server" id="ItemPager" PageSize="5" PageLinkCssClass="gridpagerbutton" SelectedPageCssClass="gridpagerbutton-selected" PagesTextCssClass="gridpagertext" CssClass="gridpager" RenderContainerDiv="true" ContainerDivCssClass="gridpagercontainer" MaxPagesToDisplay="6" PagesText="Item Pages:" NextText="next" PreviousText="previous" /> <ww:Pager runat="server" id="ItemPager2" PageSize="5" RenderContainerDiv="true" MaxPagesToDisplay="6" /> The latter example uses default style settings so it there’s not much to set. The first example on the other hand explicitly assigns custom styles and overrides a few of the formatting options. Styling The styling is based on a number of CSS classes of which the the main pager, pagerbutton and pagerbutton-selected classes are the important ones. Other styles like pagerbutton-next/prev/first/last are based on the pagerbutton style. The default styling shown for the red outlined pager looks like this: .pagercontainer { margin: 20px 0; background: whitesmoke; padding: 5px; } .pager { float: right; font-size: 10pt; text-align: left; } .pagerbutton,.pagerbutton-selected,.pagertext { display: block; float: left; text-align: center; border: solid 2px maroon; min-width: 18px; margin-left: 3px; text-decoration: none; padding: 4px; } .pagerbutton-selected { font-size: 130%; font-weight: bold; color: maroon; border-width: 0px; background: khaki; } .pagerbutton-first { margin-right: 12px; } .pagerbutton-last,.pagerbutton-prev { margin-left: 12px; } .pagertext { border: none; margin-left: 30px; font-weight: bold; } .pagerbutton a { text-decoration: none; } .pagerbutton:hover { background-color: maroon; color: cornsilk; } .pagerbutton-prev { background-image: url(images/prev.png); background-position: 2px center; background-repeat: no-repeat; width: 35px; padding-left: 20px; } .pagerbutton-next { background-image: url(images/next.png); background-position: 40px center; background-repeat: no-repeat; width: 35px; padding-right: 20px; margin-right: 0px; } Yup that’s a lot of styling settings although not all of them are required. The key ones are pagerbutton, pager and pager selection. The others (which are implicitly created by the control based on the pagerbutton style) are for custom markup of the ‘special’ buttons. In my apps I tend to have two kinds of pages: Those that are associated with typical ‘grid’ displays that display purely tabular data and those that have a more looser list like layout. The two pagers shown above represent these two views and the pager and gridpager styles in my standard style sheet reflect these two styles. Configuring the Pager with Code Finally lets look at what it takes to hook up the pager. As mentioned in the highlights the Pager control is completely independent of other controls so if you just want to display a pager on its own it’s as simple as dropping the control and assigning the PageSize, ActivePage and either TotalPages or TotalItems. So for this markup: <ww:Pager runat="server" id="ItemPagerManual" PageSize="5" MaxPagesToDisplay="6" /> I can use code as simple as: ItemPagerManual.PageSize = 3; ItemPagerManual.ActivePage = 4;ItemPagerManual.TotalItems = 20; Note that ActivePage is not required - it will automatically use any Page=x query string value and assign it, although you can override it as I did above. TotalItems can be any value that you retrieve from a result set or manually assign as I did above. A more realistic scenario based on a LINQ to SQL IQueryable result is even easier. In this example, I have a UserControl that contains a ListView control that renders IQueryable data. I use a User Control here because there are different views the user can choose from with each view being a different user control. This incidentally also highlights one of the nice features of the pager: Because the pager is independent of the control I can put the pager on the host page instead of into each of the user controls. IOW, there’s only one Pager control, but there are potentially many user controls/listviews that hold the actual display data. The following code demonstrates how to use the Pager with an IQueryable that loads only the records it displays: protected voidPage_Load(objectsender, EventArgs e) { Category = Request.Params["Category"] ?? string.Empty; IQueryable<wws_Item> ItemList = ItemRepository.GetItemsByCategory(Category); // Update the page and filter the list down ItemList = ItemPager.FilterIQueryable<wws_Item>(ItemList); // Render user control with a list view Control ulItemList = LoadControl("~/usercontrols/" + App.Configuration.ItemListType + ".ascx"); ((IInventoryItemListControl)ulItemList).InventoryItemList = ItemList; phItemList.Controls.Add(ulItemList); // placeholder } The code uses a business object to retrieve Items by category as an IQueryable which means that the result is only an expression tree that hasn’t execute SQL yet and can be further filtered. I then pass this IQueryable to the FilterIQueryable() helper method of the control which does two main things: Filters the IQueryable to retrieve only the data displayed on the active page Sets the Totaltems property and calculates TotalPages on the Pager and that’s it! When the Pager renders it uses those values, plus the PageSize and ActivePage properties to render the Pager. In addition to IQueryable there are also filter methods for IEnumerable<T> and DataTable, but these versions just filter the data by removing rows/items from the entire already retrieved data. Output Generated and Paging Links The output generated creates pager links as plain href links. Here’s what the output looks like: <div id="ItemPager" class="pagercontainer"> <div class="pager"> <span class="pagertext">Pages: </span><a href="http://localhost/WestWindWebStore/itemlist.aspx?Page=1" class="pagerbutton" />1</a> <a href="http://localhost/WestWindWebStore/itemlist.aspx?Page=2" class="pagerbutton" />2</a> <a href="http://localhost/WestWindWebStore/itemlist.aspx?Page=3" class="pagerbutton" />3</a> <span class="pagerbutton-selected">4</span> <a href="http://localhost/WestWindWebStore/itemlist.aspx?Page=5" class="pagerbutton" />5</a> <a href="http://localhost/WestWindWebStore/itemlist.aspx?Page=6" class="pagerbutton" />6</a> <a href="http://localhost/WestWindWebStore/itemlist.aspx?Page=20" class="pagerbutton pagerbutton-last" />20</a> <a href="http://localhost/WestWindWebStore/itemlist.aspx?Page=3" class="pagerbutton pagerbutton-prev" />Prev</a> <a href="http://localhost/WestWindWebStore/itemlist.aspx?Page=5" class="pagerbutton pagerbutton-next" />Next</a></div> <br clear="all" /> </div> </div> The links point back to the current page and simply append a Page= page link into the page. When the page gets reloaded with the new page number the pager automatically detects the page number and automatically assigns the ActivePage property which results in the appropriate page to be displayed. The code shown in the previous section is all that’s needed to handle paging. Note that HTTP GET based paging is different than the Postback paging ASP.NET uses by default. Postback paging preserves modified page content when clicking on pager buttons, but this control will simply load a new page – no page preservation at this time. The advantage of not using Postback paging is that the URLs generated are plain HTML links that a search engine can follow where __doPostback() links are not. Pager with a Grid The pager also works in combination with grid controls so it’s easy to bypass the grid control’s paging features if desired. In the following example I use a gridView control and binds it to a DataTable result which is also filterable by the Pager control. The very basic plain vanilla ASP.NET grid markup looks like this: <div style="width: 600px; margin: 0 auto;padding: 20px; "> <asp:DataGrid runat="server" AutoGenerateColumns="True" ID="gdItems" CssClass="blackborder" style="width: 600px;"> <AlternatingItemStyle CssClass="gridalternate" /> <HeaderStyle CssClass="gridheader" /> </asp:DataGrid> <ww:Pager runat="server" ID="Pager" CssClass="gridpager" ContainerDivCssClass="gridpagercontainer" PageLinkCssClass="gridpagerbutton" SelectedPageCssClass="gridpagerbutton-selected" PageSize="8" RenderContainerDiv="true" MaxPagesToDisplay="6" /> </div> and looks like this when rendered: using custom set of CSS styles. The code behind for this code is also very simple: protected void Page_Load(object sender, EventArgs e) { string category = Request.Params["category"] ?? ""; busItem itemRep = WebStoreFactory.GetItem(); var items = itemRep.GetItemsByCategory(category) .Select(itm => new {Sku = itm.Sku, Description = itm.Description}); // run query into a DataTable for demonstration DataTable dt = itemRep.Converter.ToDataTable(items,"TItems"); // Remove all items not on the current page dt = Pager.FilterDataTable(dt,0); // bind and display gdItems.DataSource = dt; gdItems.DataBind(); } A little contrived I suppose since the list could already be bound from the list of elements, but this is to demonstrate that you can also bind against a DataTable if your business layer returns those. Unfortunately there’s no way to filter a DataReader as it’s a one way forward only reader and the reader is required by the DataSource to perform the bindings. However, you can still use a DataReader as long as your business logic filters the data prior to rendering and provides a total item count (most likely as a second query). Control Creation The control itself is a pretty brute force ASP.NET control. Nothing clever about this other than some basic rendering logic and some simple calculations and update routines to determine which buttons need to be shown. You can take a look at the full code from the West Wind Web Toolkit’s Repository (note there are a few dependencies). To give you an idea how the control works here is the Render() method: /// <summary> /// overridden to handle custom pager rendering for runtime and design time /// </summary> /// <param name="writer"></param> protected override void Render(HtmlTextWriter writer) { base.Render(writer); if (TotalPages == 0 && TotalItems > 0) TotalPages = CalculateTotalPagesFromTotalItems(); if (DesignMode) TotalPages = 10; // don't render pager if there's only one page if (TotalPages < 2) return; if (RenderContainerDiv) { if (!string.IsNullOrEmpty(ContainerDivCssClass)) writer.AddAttribute("class", ContainerDivCssClass); writer.RenderBeginTag("div"); } // main pager wrapper writer.WriteBeginTag("div"); writer.AddAttribute("id", this.ClientID); if (!string.IsNullOrEmpty(CssClass)) writer.WriteAttribute("class", this.CssClass); writer.Write(HtmlTextWriter.TagRightChar + "\r\n"); // Pages Text writer.WriteBeginTag("span"); if (!string.IsNullOrEmpty(PagesTextCssClass)) writer.WriteAttribute("class", PagesTextCssClass); writer.Write(HtmlTextWriter.TagRightChar); writer.Write(this.PagesText); writer.WriteEndTag("span"); // if the base url is empty use the current URL FixupBaseUrl(); // set _startPage and _endPage ConfigurePagesToRender(); // write out first page link if (ShowFirstAndLastPageLinks && _startPage != 1) { writer.WriteBeginTag("a"); string pageUrl = StringUtils.SetUrlEncodedKey(BaseUrl, QueryStringPageField, (1).ToString()); writer.WriteAttribute("href", pageUrl); if (!string.IsNullOrEmpty(PageLinkCssClass)) writer.WriteAttribute("class", PageLinkCssClass + " " + PageLinkCssClass + "-first"); writer.Write(HtmlTextWriter.SelfClosingTagEnd); writer.Write("1"); writer.WriteEndTag("a"); writer.Write(" "); } // write out all the page links for (int i = _startPage; i < _endPage + 1; i++) { if (i == ActivePage) { writer.WriteBeginTag("span"); if (!string.IsNullOrEmpty(SelectedPageCssClass)) writer.WriteAttribute("class", SelectedPageCssClass); writer.Write(HtmlTextWriter.TagRightChar); writer.Write(i.ToString()); writer.WriteEndTag("span"); } else { writer.WriteBeginTag("a"); string pageUrl = StringUtils.SetUrlEncodedKey(BaseUrl, QueryStringPageField, i.ToString()).TrimEnd('&'); writer.WriteAttribute("href", pageUrl); if (!string.IsNullOrEmpty(PageLinkCssClass)) writer.WriteAttribute("class", PageLinkCssClass); writer.Write(HtmlTextWriter.SelfClosingTagEnd); writer.Write(i.ToString()); writer.WriteEndTag("a"); } writer.Write("\r\n"); } // write out last page link if (ShowFirstAndLastPageLinks && _endPage < TotalPages) { writer.WriteBeginTag("a"); string pageUrl = StringUtils.SetUrlEncodedKey(BaseUrl, QueryStringPageField, TotalPages.ToString()); writer.WriteAttribute("href", pageUrl); if (!string.IsNullOrEmpty(PageLinkCssClass)) writer.WriteAttribute("class", PageLinkCssClass + " " + PageLinkCssClass + "-last"); writer.Write(HtmlTextWriter.SelfClosingTagEnd); writer.Write(TotalPages.ToString()); writer.WriteEndTag("a"); } // Previous link if (ShowPreviousNextLinks && !string.IsNullOrEmpty(PreviousText) && ActivePage > 1) { writer.Write(" "); writer.WriteBeginTag("a"); string pageUrl = StringUtils.SetUrlEncodedKey(BaseUrl, QueryStringPageField, (ActivePage - 1).ToString()); writer.WriteAttribute("href", pageUrl); if (!string.IsNullOrEmpty(PageLinkCssClass)) writer.WriteAttribute("class", PageLinkCssClass + " " + PageLinkCssClass + "-prev"); writer.Write(HtmlTextWriter.SelfClosingTagEnd); writer.Write(PreviousText); writer.WriteEndTag("a"); } // Next link if (ShowPreviousNextLinks && !string.IsNullOrEmpty(NextText) && ActivePage < TotalPages) { writer.Write(" "); writer.WriteBeginTag("a"); string pageUrl = StringUtils.SetUrlEncodedKey(BaseUrl, QueryStringPageField, (ActivePage + 1).ToString()); writer.WriteAttribute("href", pageUrl); if (!string.IsNullOrEmpty(PageLinkCssClass)) writer.WriteAttribute("class", PageLinkCssClass + " " + PageLinkCssClass + "-next"); writer.Write(HtmlTextWriter.SelfClosingTagEnd); writer.Write(NextText); writer.WriteEndTag("a"); } writer.WriteEndTag("div"); if (RenderContainerDiv) { if (RenderContainerDivBreak) writer.Write("<br clear=\"all\" />\r\n"); writer.WriteEndTag("div"); } } As I said pretty much brute force rendering based on the control’s property settings of which there are quite a few: You can also see the pager in the designer above. unfortunately the VS designer (both 2010 and 2008) fails to render the float: left CSS styles properly and starts wrapping after margins are applied in the special buttons. Not a big deal since VS does at least respect the spacing (the floated elements overlay). Then again I’m not using the designer anyway :-}. Filtering Data What makes the Pager easy to use is the filter methods built into the control. While this functionality is clearly not the most politically correct design choice as it violates separation of concerns, it’s very useful for typical pager operation. While I actually have filter methods that do something similar in my business layer, having it exposed on the control makes the control a lot more useful for typical databinding scenarios. Of course these methods are optional – if you have a business layer that can provide filtered page queries for you can use that instead and assign the TotalItems property manually. There are three filter method types available for IQueryable, IEnumerable and for DataTable which tend to be the most common use cases in my apps old and new. The IQueryable version is pretty simple as it can simply rely on on .Skip() and .Take() with LINQ: /// <summary> /// <summary> /// Queries the database for the ActivePage applied manually /// or from the Request["page"] variable. This routine /// figures out and sets TotalPages, ActivePage and /// returns a filtered subset IQueryable that contains /// only the items from the ActivePage. /// </summary> /// <param name="query"></param> /// <param name="activePage"> /// The page you want to display. Sets the ActivePage property when passed. /// Pass 0 or smaller to use ActivePage setting. /// </param> /// <returns></returns> public IQueryable<T> FilterIQueryable<T>(IQueryable<T> query, int activePage) where T : class, new() { ActivePage = activePage < 1 ? ActivePage : activePage; if (ActivePage < 1) ActivePage = 1; TotalItems = query.Count(); if (TotalItems <= PageSize) { ActivePage = 1; TotalPages = 1; return query; } int skip = ActivePage - 1; if (skip > 0) query = query.Skip(skip * PageSize); _TotalPages = CalculateTotalPagesFromTotalItems(); return query.Take(PageSize); } The IEnumerable<T> version simply converts the IEnumerable to an IQuerable and calls back into this method for filtering. The DataTable version requires a little more work to manually parse and filter records (I didn’t want to add the Linq DataSetExtensions assembly just for this): /// <summary> /// Filters a data table for an ActivePage. /// /// Note: Modifies the data set permanently by remove DataRows /// </summary> /// <param name="dt">Full result DataTable</param> /// <param name="activePage">Page to display. 0 to use ActivePage property </param> /// <returns></returns> public DataTable FilterDataTable(DataTable dt, int activePage) { ActivePage = activePage < 1 ? ActivePage : activePage; if (ActivePage < 1) ActivePage = 1; TotalItems = dt.Rows.Count; if (TotalItems <= PageSize) { ActivePage = 1; TotalPages = 1; return dt; } int skip = ActivePage - 1; if (skip > 0) { for (int i = 0; i < skip * PageSize; i++ ) dt.Rows.RemoveAt(0); } while(dt.Rows.Count > PageSize) dt.Rows.RemoveAt(PageSize); return dt; } Using the Pager Control The pager as it is is a first cut I built a couple of weeks ago and since then have been tweaking a little as part of an internal project I’m working on. I’ve replaced a bunch of pagers on various older pages with this pager without any issues and have what now feels like a more consistent user interface where paging looks and feels the same across different controls. As a bonus I’m only loading the data from the database that I need to display a single page. With the preset class tags applied too adding a pager is now as easy as dropping the control and adding the style sheet for styling to be consistent – no fuss, no muss. Schweet. Hopefully some of you may find this as useful as I have or at least as a baseline to build ontop of… Resources The Pager is part of the West Wind Web & Ajax Toolkit Pager.cs Source Code (some toolkit dependencies) Westwind.css base stylesheet with .pager and .gridpager styles Pager Example Page © Rick Strahl, West Wind Technologies, 2005-2010Posted in ASP.NET

Read the article

What’s New in ASP.NET 4.0 Part Two: WebForms and Visual Studio Enhancements

- by Rick Strahl

In the last installment I talked about the core changes in the ASP.NET runtime that I’ve been taking advantage of. In this column, I’ll cover the changes to the Web Forms engine and some of the cool improvements in Visual Studio that make Web and general development easier. WebForms The WebForms engine is the area that has received most significant changes in ASP.NET 4.0. Probably the most widely anticipated features are related to managing page client ids and of ViewState on WebForm pages. Take Control of Your ClientIDs Unique ClientID generation in ASP.NET has been one of the most complained about “features” in ASP.NET. Although there’s a very good technical reason for these unique generated ids - they guarantee unique ids for each and every server control on a page - these unique and generated ids often get in the way of client-side JavaScript development and CSS styling as it’s often inconvenient and fragile to work with the long, generated ClientIDs. In ASP.NET 4.0 you can now specify an explicit client id mode on each control or each naming container parent control to control how client ids are generated. By default, ASP.NET generates mangled client ids for any control contained in a naming container (like a Master Page, or a User Control for example). The key to ClientID management in ASP.NET 4.0 are the new ClientIDMode and ClientIDRowSuffix properties. ClientIDMode supports four different ClientID generation settings shown below. For the following examples, imagine that you have a Textbox control named txtName inside of a master page control container on a WebForms page. <%@Page Language="C#" MasterPageFile="~/Site.Master" CodeBehind="WebForm2.aspx.cs" Inherits="WebApplication1.WebForm2" %> <asp:Content ID="content" ContentPlaceHolderID="content" runat="server" ClientIDMode="Static" > <asp:TextBox runat="server" ID="txtName" /> </asp:Content> The four available ClientIDMode values are: AutoID This is the existing behavior in ASP.NET 1.x-3.x where full naming container munging takes place. <input name="ctl00$content$txtName" type="text" id="ctl00_content_txtName" /> This should be familiar to any ASP.NET developer and results in fairly unpredictable client ids that can easily change if the containership hierarchy changes. For example, removing the master page changes the name in this case, so if you were to move a block of script code that works against the control to a non-Master page, the script code immediately breaks. Static This option is the most deterministic setting that forces the control’s ClientID to use its ID value directly. No naming container naming at all is applied and you end up with clean client ids: <input name="ctl00$content$txtName" type="text" id="txtName" /> Note that the name property which is used for postback variables to the server still is munged, but the ClientID property is displayed simply as the ID value that you have assigned to the control. This option is what most of us want to use, but you have to be clear on that because it can potentially cause conflicts with other controls on the page. If there are several instances of the same naming container (several instances of the same user control for example) there can easily be a client id naming conflict. Note that if you assign Static to a data-bound control, like a list child control in templates, you do not get unique ids either, so for list controls where you rely on unique id for child controls, you’ll probably want to use Predictable rather than Static. I’ll write more on this a little later when I discuss ClientIDRowSuffix. Predictable The previous two values are pretty self-explanatory. Predictable however, requires some explanation. To me at least it’s not in the least bit predictable. MSDN defines this value as follows: This algorithm is used for controls that are in data-bound controls. The ClientID value is generated by concatenating the ClientID value of the parent naming container with the ID value of the control. If the control is a data-bound control that generates multiple rows, the value of the data field specified in the ClientIDRowSuffix property is added at the end. For the GridView control, multiple data fields can be specified. If the ClientIDRowSuffix property is blank, a sequential number is added at the end instead of a data-field value. Each segment is separated by an underscore character (_). The key that makes this value a bit confusing is that it relies on the parent NamingContainer’s ClientID to build its own ClientID value. This effectively means that the value is not predictable at all but rather very tightly coupled to the parent naming container’s ClientIDMode setting. For my simple textbox example, if the ClientIDMode property of the parent naming container (Page in this case) is set to “Predictable” you’ll get this: <input name="ctl00$content$txtName" type="text" id="content_txtName" /> which gives an id that based on walking up to the currently active naming container (the MasterPage content container) and starting the id formatting from there downward. Think of this as a semi unique name that’s guaranteed unique only for the naming container. If, on the other hand, the Page is set to “AutoID” you get the following with Predictable on txtName: <input name="ctl00$content$txtName" type="text" id="ctl00_content_txtName" /> The latter is effectively the same as if you specified AutoID because it inherits the AutoID naming from the Page and Content Master Page control of the page. But again - predictable behavior always depends on the parent naming container and how it generates its id, so the id may not always be exactly the same as the AutoID generated value because somewhere in the NamingContainer chain the ClientIDMode setting may be set to a different value. For example, if you had another naming container in the middle that was set to Static you’d end up effectively with an id that starts with the NamingContainers id rather than the whole ctl000_content munging. The most common use for Predictable is likely to be for data-bound controls, which results in each data bound item getting a unique ClientID. Unfortunately, even here the behavior can be very unpredictable depending on which data-bound control you use - I found significant differences in how template controls in a GridView behave from those that are used in a ListView control. For example, GridView creates clean child ClientIDs, while ListView still has a naming container in the ClientID, presumably because of the template container on which you can’t set ClientIDMode. Predictable is useful, but only if all naming containers down the chain use this setting. Otherwise you’re right back to the munged ids that are pretty unpredictable. Another property, ClientIDRowSuffix, can be used in combination with ClientIDMode of Predictable to force a suffix onto list client controls. For example: <asp:GridView runat="server" ID="gvItems" AutoGenerateColumns="false" ClientIDMode="Static" ClientIDRowSuffix="Id"> <Columns> <asp:TemplateField> <ItemTemplate> <asp:Label runat="server" id="txtName" Text='<%# Eval("Name") %>' ClientIDMode="Predictable"/> </ItemTemplate> </asp:TemplateField> <asp:TemplateField> <ItemTemplate> <asp:Label runat="server" id="txtId" Text='<%# Eval("Id") %>' ClientIDMode="Predictable" /> </ItemTemplate> </asp:TemplateField> </Columns> </asp:GridView> generates client Ids inside of a column in the master page described earlier: <td> <span id="txtName_0">Rick</span> </td> where the value after the underscore is the ClientIDRowSuffix field - in this case “Id” of the item data bound to the control. Note that all of the child controls require ClientIDMode=”Predictable” in order for the ClientIDRowSuffix to be applied, and the parent GridView controls need to be set to Static either explicitly or via Naming Container inheritance to give these simple names. It’s a bummer that ClientIDRowSuffix doesn’t work with Static to produce this automatically. Another real problem is that other controls process the ClientIDMode differently. For example, a ListView control processes the Predictable ClientIDMode differently and produces the following with the Static ListView and Predictable child controls: <span id="ctrl0_txtName_0">Rick</span> I couldn’t even figure out a way using ClientIDMode to get a simple ID that also uses a suffix short of falling back to manually generated ids using <%= %> expressions instead. Given the inconsistencies inside of list controls using <%= %>, ids for the ListView might not be a bad idea anyway. Inherit The final setting is Inherit, which is the default for all controls except Page. This means that controls by default inherit the parent naming container’s ClientIDMode setting. For more detailed information on ClientID behavior and different scenarios you can check out a blog post of mine on this subject: http://www.west-wind.com/weblog/posts/54760.aspx. ClientID Enhancements Summary The ClientIDMode property is a welcome addition to ASP.NET 4.0. To me this is probably the most useful WebForms feature as it allows me to generate clean IDs simply by setting ClientIDMode="Static" on either the page or inside of Web.config (in the Pages section) which applies the setting down to the entire page which is my 95% scenario. For the few cases when it matters - for list controls and inside of multi-use user controls or custom server controls) - I can use Predictable or even AutoID to force controls to unique names. For application-level page development, this is easy to accomplish and provides maximum usability for working with client script code against page controls. ViewStateMode Another area of large criticism for WebForms is ViewState. ViewState is used internally by ASP.NET to persist page-level changes to non-postback properties on controls as pages post back to the server. It’s a useful mechanism that works great for the overall mechanics of WebForms, but it can also cause all sorts of overhead for page operation as ViewState can very quickly get out of control and consume huge amounts of bandwidth in your page content. ViewState can also wreak havoc with client-side scripting applications that modify control properties that are tracked by ViewState, which can produce very unpredictable results on a Postback after client-side updates. Over the years in my own development, I’ve often turned off ViewState on pages to reduce overhead. Yes, you lose some functionality, but you can easily implement most of the common functionality in non-ViewState workarounds. Relying less on heavy ViewState controls and sticking with simpler controls or raw HTML constructs avoids getting around ViewState problems. In ASP.NET 3.x and prior, it wasn’t easy to control ViewState - you could turn it on or off and if you turned it off at the page or web.config level, you couldn’t turn it back on for specific controls. In short, it was an all or nothing approach. With ASP.NET 4.0, the new ViewStateMode property gives you more control. It allows you to disable ViewState globally either on the page or web.config level and then turn it back on for specific controls that might need it. ViewStateMode only works when EnableViewState="true" on the page or web.config level (which is the default). You can then use ViewStateMode of Disabled, Enabled or Inherit to control the ViewState settings on the page. If you’re shooting for minimal ViewState usage, the ideal situation is to set ViewStateMode to disabled on the Page or web.config level and only turn it back on particular controls: <%@Page Language="C#" CodeBehind="WebForm2.aspx.cs" Inherits="Westwind.WebStore.WebForm2" ClientIDMode="Static" ViewStateMode="Disabled" EnableViewState="true" %>  <asp:TextBox runat="server" ID="txtName" ViewStateMode="Enabled" />  <asp:TextBox runat="server" ID="txtAddress" /> Note that the EnableViewState="true" at the Page level isn’t required since it’s the default, but it’s important that the value is true. ViewStateMode has no effect if EnableViewState="false" at the page level. The main benefit of ViewStateMode is that it allows you to more easily turn off ViewState for most of the page and enable only a few key controls that might need it. For me personally, this is a perfect combination as most of my WebForm apps can get away without any ViewState at all. But some controls - especially third party controls - often don’t work well without ViewState enabled, and now it’s much easier to selectively enable controls rather than the old way, which required you to pretty much turn off ViewState for all controls that you didn’t want ViewState on. Inline HTML Encoding HTML encoding is an important feature to prevent cross-site scripting attacks in data entered by users on your site. In order to make it easier to create HTML encoded content, ASP.NET 4.0 introduces a new Expression syntax using <%: %> to encode string values. The encoding expression syntax looks like this: <%: "<script type='text/javascript'>" + "alert('Really?');</script>" %> which produces properly encoded HTML: <script type='text/javascript' >alert('Really?');</script> Effectively this is a shortcut to: <%= HttpUtility.HtmlEncode( "<script type='text/javascript'>" + "alert('Really?');</script>") %> Of course the <%: %> syntax can also evaluate expressions just like <%= %> so the more common scenario applies this expression syntax against data your application is displaying. Here’s an example displaying some data model values: <%: Model.Address.Street %> This snippet shows displaying data from your application’s data store or more importantly, from data entered by users. Anything that makes it easier and less verbose to HtmlEncode text is a welcome addition to avoid potential cross-site scripting attacks. Although I listed Inline HTML Encoding here under WebForms, anything that uses the WebForms rendering engine including ASP.NET MVC, benefits from this feature. ScriptManager Enhancements The ASP.NET ScriptManager control in the past has introduced some nice ways to take programmatic and markup control over script loading, but there were a number of shortcomings in this control. The ASP.NET 4.0 ScriptManager has a number of improvements that make it easier to control script loading and addresses a few of the shortcomings that have often kept me from using the control in favor of manual script loading. The first is the AjaxFrameworkMode property which finally lets you suppress loading the ASP.NET AJAX runtime. Disabled doesn’t load any ASP.NET AJAX libraries, but there’s also an Explicit mode that lets you pick and choose the library pieces individually and reduce the footprint of ASP.NET AJAX script included if you are using the library. There’s also a new EnableCdn property that forces any script that has a new WebResource attribute CdnPath property set to a CDN supplied URL. If the script has this Attribute property set to a non-null/empty value and EnableCdn is enabled on the ScriptManager, that script will be served from the specified CdnPath. [assembly: WebResource( "Westwind.Web.Resources.ww.jquery.js", "application/x-javascript", CdnPath = "http://mysite.com/scripts/ww.jquery.min.js")] Cool, but a little too static for my taste since this value can’t be changed at runtime to point at a debug script as needed, for example. Assembly names for loading scripts from resources can now be simple names rather than fully qualified assembly names, which make it less verbose to reference scripts from assemblies loaded from your bin folder or the assembly reference area in web.config: <asp:ScriptManager runat="server" id="Id" EnableCdn="true" AjaxFrameworkMode="disabled"> <Scripts> <asp:ScriptReference Name="Westwind.Web.Resources.ww.jquery.js" Assembly="Westwind.Web" /> </Scripts> </asp:ScriptManager> The ScriptManager in 4.0 also supports script combining via the CompositeScript tag, which allows you to very easily combine scripts into a single script resource served via ASP.NET. Even nicer: You can specify the URL that the combined script is served with. Check out the following script manager markup that combines several static file scripts and a script resource into a single ASP.NET served resource from a static URL (allscripts.js): <asp:ScriptManager runat="server" id="Id" EnableCdn="true" AjaxFrameworkMode="disabled"> <CompositeScript Path="~/scripts/allscripts.js"> <Scripts> <asp:ScriptReference Path="~/scripts/jquery.js" /> <asp:ScriptReference Path="~/scripts/ww.jquery.js" /> <asp:ScriptReference Name="Westwind.Web.Resources.editors.js" Assembly="Westwind.Web" /> </Scripts> </CompositeScript> </asp:ScriptManager> When you render this into HTML, you’ll see a single script reference in the page: <script src="scripts/allscripts.debug.js" type="text/javascript"></script> All you need to do to make this work is ensure that allscripts.js and allscripts.debug.js exist in the scripts folder of your application - they can be empty but the file has to be there. This is pretty cool, but you want to be real careful that you use unique URLs for each combination of scripts you combine or else browser and server caching will easily screw you up royally. The script manager also allows you to override native ASP.NET AJAX scripts now as any script references defined in the Scripts section of the ScriptManager trump internal references. So if you want custom behavior or you want to fix a possible bug in the core libraries that normally are loaded from resources, you can now do this simply by referencing the script resource name in the Name property and pointing at System.Web for the assembly. Not a common scenario, but when you need it, it can come in real handy. Still, there are a number of shortcomings in this control. For one, the ScriptManager and ClientScript APIs still have no common entry point so control developers are still faced with having to check and support both APIs to load scripts so that controls can work on pages that do or don’t have a ScriptManager on the page. The CdnUrl is static and compiled in, which is very restrictive. And finally, there’s still no control over where scripts get loaded on the page - ScriptManager still injects scripts into the middle of the HTML markup rather than in the header or optionally the footer. This, in turn, means there is little control over script loading order, which can be problematic for control developers. MetaDescription, MetaKeywords Page Properties There are also a number of additional Page properties that correspond to some of the other features discussed in this column: ClientIDMode, ClientTarget and ViewStateMode. Another minor but useful feature is that you can now directly access the MetaDescription and MetaKeywords properties on the Page object to set the corresponding meta tags programmatically. Updating these values programmatically previously required either <%= %> expressions in the page markup or dynamic insertion of literal controls into the page. You can now just set these properties programmatically on the Page object in any Control derived class on the page or the Page itself: Page.MetaKeywords = "ASP.NET,4.0,New Features"; Page.MetaDescription = "This article discusses the new features in ASP.NET 4.0"; Note, that there’s no corresponding ASP.NET tag for the HTML Meta element, so the only way to specify these values in markup and access them is via the @Page tag: <%@Page Language="C#" CodeBehind="WebForm2.aspx.cs" Inherits="Westwind.WebStore.WebForm2" ClientIDMode="Static" MetaDescription="Article that discusses what's new in ASP.NET 4.0" MetaKeywords="ASP.NET,4.0,New Features" %> Nothing earth shattering but quite convenient. Visual Studio 2010 Enhancements for Web Development For Web development there are also a host of editor enhancements in Visual Studio 2010. Some of these are not Web specific but they are useful for Web developers in general. Text Editors Throughout Visual Studio 2010, the text editors have all been updated to a new core engine based on WPF which provides some interesting new features for various code editors including the nice ability to zoom in and out with Ctrl-MouseWheel to quickly change the size of text. There are many more API options to control the editor and although Visual Studio 2010 doesn’t yet use many of these features, we can look forward to enhancements in add-ins and future editor updates from the various language teams that take advantage of the visual richness that WPF provides to editing. On the negative side, I’ve noticed that occasionally the code editor and especially the HTML and JavaScript editors will lose the ability to use various navigation keys like arrows, back and delete keys, which requires closing and reopening the documents at times. This issue seems to be well documented so I suspect this will be addressed soon with a hotfix or within the first service pack. Overall though, the code editors work very well, especially given that they were re-written completely using WPF, which was one of my big worries when I first heard about the complete redesign of the editors. Multi-Targeting Visual Studio now targets all versions of the .NET framework from 2.0 forward. You can use Visual Studio 2010 to work on your ASP.NET 2, 3.0 and 3.5 applications which is a nice way to get your feet wet with the new development environment without having to make changes to existing applications. It’s nice to have one tool to work in for all the different versions. Multi-Monitor Support One cool feature of Visual Studio 2010 is the ability to drag windows out of the Visual Studio environment and out onto the desktop including onto another monitor easily. Since Web development often involves working with a host of designers at the same time - visual designer, HTML markup window, code behind and JavaScript editor - it’s really nice to be able to have a little more screen real estate to work on each of these editors. Microsoft made a welcome change in the environment. IntelliSense Snippets for HTML and JavaScript Editors The HTML and JavaScript editors now finally support IntelliSense scripts to create macro-based template expansions that have been in the core C# and Visual Basic code editors since Visual Studio 2005. Snippets allow you to create short XML-based template definitions that can act as static macros or real templates that can have replaceable values that can be embedded into the expanded text. The XML syntax for these snippets is straight forward and it’s pretty easy to create custom snippets manually. You can easily create snippets using XML and store them in your custom snippets folder (C:\Users\rstrahl\Documents\Visual Studio 2010\Code Snippets\Visual Web Developer\My HTML Snippets and My JScript Snippets), but it helps to use one of the third-party tools that exist to simplify the process for you. I use SnippetEditor, by Bill McCarthy, which makes short work of creating snippets interactively (http://snippeteditor.codeplex.com/). Note: You may have to manually add the Visual Studio 2010 User specific Snippet folders to this tool to see existing ones you’ve created. Code snippets are some of the biggest time savers and HTML editing more than anything deals with lots of repetitive tasks that lend themselves to text expansion. Visual Studio 2010 includes a slew of built-in snippets (that you can also customize!) and you can create your own very easily. If you haven’t done so already, I encourage you to spend a little time examining your coding patterns and find the repetitive code that you write and convert it into snippets. I’ve been using CodeRush for this for years, but now you can do much of the basic expansion natively for HTML and JavaScript snippets. jQuery Integration Is Now Native jQuery is a popular JavaScript library and recently Microsoft has recently stated that it will become the primary client-side scripting technology to drive higher level script functionality in various ASP.NET Web projects that Microsoft provides. In Visual Studio 2010, the default full project template includes jQuery as part of a new project including the support files that provide IntelliSense (-vsdoc files). IntelliSense support for jQuery is now also baked into Visual Studio 2010, so unlike Visual Studio 2008 which required a separate download, no further installs are required for a rich IntelliSense experience with jQuery. Summary ASP.NET 4.0 brings many useful improvements to the platform, but thankfully most of the changes are incremental changes that don’t compromise backwards compatibility and they allow developers to ease into the new features one feature at a time. None of the changes in ASP.NET 4.0 or Visual Studio 2010 are monumental or game changers. The bigger features are language and .NET Framework changes that are also optional. This ASP.NET and tools release feels more like fine tuning and getting some long-standing kinks worked out of the platform. It shows that the ASP.NET team is dedicated to paying attention to community feedback and responding with changes to the platform and development environment based on this feedback. If you haven’t gotten your feet wet with ASP.NET 4.0 and Visual Studio 2010, there’s no reason not to give it a shot now - the ASP.NET 4.0 platform is solid and Visual Studio 2010 works very well for a brand new release. Check it out. © Rick Strahl, West Wind Technologies, 2005-2010Posted in ASP.NET

Read the article

Using HTML 5 SessionState to save rendered Page Content

- by Rick Strahl

HTML 5 SessionState and LocalStorage are very useful and super easy to use to manage client side state. For building rich client side or SPA style applications it's a vital feature to be able to cache user data as well as HTML content in order to swap pages in and out of the browser's DOM. What might not be so obvious is that you can also use the sessionState and localStorage objects even in classic server rendered HTML applications to provide caching features between pages. These APIs have been around for a long time and are supported by most relatively modern browsers and even all the way back to IE8, so you can use them safely in your Web applications. SessionState and LocalStorage are easy The APIs that make up sessionState and localStorage are very simple. Both object feature the same API interface which is a simple, string based key value store that has getItem, setItem, removeitem, clear and key methods. The objects are also pseudo array objects and so can be iterated like an array with a length property and you have array indexers to set and get values with. Basic usage for storing and retrieval looks like this (using sessionStorage, but the syntax is the same for localStorage - just switch the objects):// set var lastAccess = new Date().getTime(); if (sessionStorage) sessionStorage.setItem("myapp_time", lastAccess.toString()); // retrieve in another page or on a refresh var time = null; if (sessionStorage) time = sessionStorage.getItem("myapp_time"); if (time) time = new Date(time * 1); else time = new Date(); sessionState stores data that is browser session specific and that has a liftetime of the active browser session or window. Shut down the browser or tab and the storage goes away. localStorage uses the same API interface, but the lifetime of the data is permanently stored in the browsers storage area until deleted via code or by clearing out browser cookies (not the cache). Both sessionStorage and localStorage space is limited. The spec is ambiguous about this - supposedly sessionStorage should allow for unlimited size, but it appears that most WebKit browsers support only 2.5mb for either object. This means you have to be careful what you store especially since other applications might be running on the same domain and also use the storage mechanisms. That said 2.5mb worth of character data is quite a bit and would go a long way. The easiest way to get a feel for how sessionState and localStorage work is to look at a simple example. You can go check out the following example online in Plunker: http://plnkr.co/edit/0ICotzkoPjHaWa70GlRZ?p=preview which looks like this: Plunker is an online HTML/JavaScript editor that lets you write and run Javascript code and similar to JsFiddle, but a bit cleaner to work in IMHO (thanks to John Papa for turning me on to it). The sample has two text boxes with counts that update session/local storage every time you click the related button. The counts are 'cached' in Session and Local storage. The point of these examples is that both counters survive full page reloads, and the LocalStorage counter survives a complete browser shutdown and restart. Go ahead and try it out by clicking the Reload button after updating both counters and then shutting down the browser completely and going back to the same URL (with the same browser). What you should see is that reloads leave both counters intact at the counted values, while a browser restart will leave only the local storage counter intact. The code to deal with the SessionStorage (and LocalStorage not shown here) in the example is isolated into a couple of wrapper methods to simplify the code: function getSessionCount() { var count = 0; if (sessionStorage) { var count = sessionStorage.getItem("ss_count"); count = !count ? 0 : count * 1; } $("#txtSession").val(count); return count; } function setSessionCount(count) { if (sessionStorage) sessionStorage.setItem("ss_count", count.toString()); } These two functions essentially load and store a session counter value. The two key methods used here are: sessionStorage.getItem(key); sessionStorage.setItem(key,stringVal); Note that the value given to setItem and return by getItem has to be a string. If you pass another type you get an error. Don't let that limit you though - you can easily enough store JSON data in a variable so it's quite possible to pass complex objects and store them into a single sessionStorage value:var user = { name: "Rick", id="ricks", level=8 } sessionStorage.setItem("app_user",JSON.stringify(user)); to retrieve it:var user = sessionStorage.getItem("app_user"); if (user) user = JSON.parse(user); Simple! If you're using the Chrome Developer Tools (F12) you can also check out the session and local storage state on the Resource tab: You can also use this tool to refresh or remove entries from storage. What we just looked at is a purely client side implementation where a couple of counters are stored. For rich client centric AJAX applications sessionStorage and localStorage provide a very nice and simple API to store application state while the application is running. But you can also use these storage mechanisms to manage server centric HTML applications when you combine server rendering with some JavaScript to perform client side data caching. You can both store some state information and data on the client (ie. store a JSON object and carry it forth between server rendered HTML requests) or you can use it for good old HTTP based caching where some rendered HTML is saved and then restored later. Let's look at the latter with a real life example. Why do I need Client-side Page Caching for Server Rendered HTML? I don't know about you, but in a lot of my existing server driven applications I have lists that display a fair amount of data. Typically these lists contain links to then drill down into more specific data either for viewing or editing. You can then click on a link and go off to a detail page that provides more concise content. So far so good. But now you're done with the detail page and need to get back to the list, so you click on a 'bread crumbs trail' or an application level 'back to list' button and… …you end up back at the top of the list - the scroll position, the current selection in some cases even filters conditions - all gone with the wind. You've left behind the state of the list and are starting from scratch in your browsing of the list from the top. Not cool! Sound familiar? This a pretty common scenario with server rendered HTML content where it's so common to display lists to drill into, only to lose state in the process of returning back to the original list. Look at just about any traditional forums application, or even StackOverFlow to see what I mean here. Scroll down a bit to look at a post or entry, drill in then use the bread crumbs or tab to go back… In some cases returning to the top of a list is not a big deal. On StackOverFlow that sort of works because content is turning around so quickly you probably want to actually look at the top posts. Not always though - if you're browsing through a list of search topics you're interested in and drill in there's no way back to that position. Essentially anytime you're actively browsing the items in the list, that's when state becomes important and if it's not handled the user experience can be really disrupting. Content Caching If you're building client centric SPA style applications this is a fairly easy to solve problem - you tend to render the list once and then update the page content to overlay the detail content, only hiding the list temporarily until it's used again later. It's relatively easy to accomplish this simply by hiding content on the page and later making it visible again. But if you use server rendered content, hanging on to all the detail like filters, selections and scroll position is not quite as easy. Or is it??? This is where sessionStorage comes in handy. What if we just save the rendered content of a previous page, and then restore it when we return to this page based on a special flag that tells us to use the cached version? Let's see how we can do this. A real World Use Case Recently my local ISP asked me to help out with updating an ancient classifieds application. They had a very busy, local classifieds app that was originally an ASP classic application. The old app was - wait for it: frames based - and even though I lobbied against it, the decision was made to keep the frames based layout to allow rapid browsing of the hundreds of posts that are made on a daily basis. The primary reason they wanted this was precisely for the ability to quickly browse content item by item. While I personally hate working with Frames, I have to admit that the UI actually works well with the frames layout as long as you're running on a large desktop screen. You can check out the frames based desktop site here: http://classifieds.gorge.net/ However when I rebuilt the app I also added a secondary view that doesn't use frames. The main reason for this of course was for mobile displays which work horribly with frames. So there's a somewhat mobile friendly interface to the interface, which ditches the frames and uses some responsive design tweaking for mobile capable operation: http://classifeds.gorge.net/mobile (or browse the base url with your browser width under 800px) Here's what the mobile, non-frames view looks like: As you can see this means that the list of classifieds posts now is a list and there's a separate page for drilling down into the item. And of course… originally we ran into that usability issue I mentioned earlier where the browse, view detail, go back to the list cycle resulted in lost list state. Originally in mobile mode you scrolled through the list, found an item to look at and drilled in to display the item detail. Then you clicked back to the list and BAM - you've lost your place. Because there are so many items added on a daily basis the full list is never fully loaded, but rather there's a "Load Additional Listings" entry at the button. Not only did we originally lose our place when coming back to the list, but any 'additionally loaded' items are no longer there because the list was now rendering as if it was the first page hit. The additional listings, and any filters, the selection of an item all were lost. Major Suckage! Using Client SessionStorage to cache Server Rendered Content To work around this problem I decided to cache the rendered page content from the list in SessionStorage. Anytime the list renders or is updated with Load Additional Listings, the page HTML is cached and stored in Session Storage. Any back links from the detail page or the login or write entry forms then point back to the list page with a back=true query string parameter. If the server side sees this parameter it doesn't render the part of the page that is cached. Instead the client side code retrieves the data from the sessionState cache and simply inserts it into the page. It sounds pretty simple, and the overall the process is really easy, but there are a few gotchas that I'll discuss in a minute. But first let's look at the implementation. Let's start with the server side here because that'll give a quick idea of the doc structure. As I mentioned the server renders data from an ASP.NET MVC view. On the list page when returning to the list page from the display page (or a host of other pages) looks like this: https://classifieds.gorge.net/list?back=True The query string value is a flag, that indicates whether the server should render the HTML. Here's what the top level MVC Razor view for the list page looks like:@model MessageListViewModel @{ ViewBag.Title = "Classified Listing"; bool isBack = !string.IsNullOrEmpty(Request.QueryString["back"]); } <form method="post" action="@Url.Action("list")"> <div id="SizingContainer"> @if (!isBack) { @Html.Partial("List_CommandBar_Partial", Model) <div id="PostItemContainer" class="scrollbox" xstyle="-webkit-overflow-scrolling: touch;"> @Html.Partial("List_Items_Partial", Model) @if (Model.RequireLoadEntry) { <div class="postitem loadpostitems" style="padding: 15px;"> <div id="LoadProgress" class="smallprogressright"></div> <div class="control-progress"> Load additional listings... </div> </div> } </div> } </div> </form> As you can see the query string triggers a conditional block that if set is simply not rendered. The content inside of #SizingContainer basically holds the entire page's HTML sans the headers and scripts, but including the filter options and menu at the top. In this case this makes good sense - in other situations the fact that the menu or filter options might be dynamically updated might make you only cache the list rather than essentially the entire page. In this particular instance all of the content works and produces the proper result as both the list along with any filter conditions in the form inputs are restored. Ok, let's move on to the client. On the client there are two page level functions that deal with saving and restoring state. Like the counter example I showed earlier, I like to wrap the logic to save and restore values from sessionState into a separate function because they are almost always used in several places.page.saveData = function(id) { if (!sessionStorage) return; var data = { id: id, scroll: $("#PostItemContainer").scrollTop(), html: $("#SizingContainer").html() }; sessionStorage.setItem("list_html",JSON.stringify(data)); }; page.restoreData = function() { if (!sessionStorage) return; var data = sessionStorage.getItem("list_html"); if (!data) return null; return JSON.parse(data); }; The data that is saved is an object which contains an ID which is the selected element when the user clicks and a scroll position. These two values are used to reset the scroll position when the data is used from the cache. Finally the html from the #SizingContainer element is stored, which makes for the bulk of the document's HTML. In this application the HTML captured could be a substantial bit of data. If you recall, I mentioned that the server side code renders a small chunk of data initially and then gets more data if the user reads through the first 50 or so items. The rest of the items retrieved can be rather sizable. Other than the JSON deserialization that's Ok. Since I'm using SessionStorage the storage space has no immediate limits. Next is the core logic to handle saving and restoring the page state. At first though this would seem pretty simple, and in some cases it might be, but as the following code demonstrates there are a few gotchas to watch out for. Here's the relevant code I use to save and restore:$( function() { … var isBack = getUrlEncodedKey("back", location.href); if (isBack) { // remove the back key from URL setUrlEncodedKey("back", "", location.href); var data = page.restoreData(); // restore from sessionState if (!data) { // no data - force redisplay of the server side default list window.location = "list"; return; } $("#SizingContainer").html(data.html); var el = $(".postitem[data-id=" + data.id + "]"); $(".postitem").removeClass("highlight"); el.addClass("highlight"); $("#PostItemContainer").scrollTop(data.scroll); setTimeout(function() { el.removeClass("highlight"); }, 2500); } else if (window.noFrames) page.saveData(null); // save when page loads $("#SizingContainer").on("click", ".postitem", function() { var id = $(this).attr("data-id"); if (!id) return true; if (window.noFrames) page.saveData(id); var contentFrame = window.parent.frames["Content"]; if (contentFrame) contentFrame.location.href = "show/" + id; else window.location.href = "show/" + id; return false; }); … The code starts out by checking for the back query string flag which triggers restoring from the client cache. If cached the cached data structure is read from sessionStorage. It's important here to check if data was returned. If the user had back=true on the querystring but there is no cached data, he likely bookmarked this page or otherwise shut down the browser and came back to this URL. In that case the server didn't render any detail and we have no cached data, so all we can do is redirect to the original default list view using window.location. If we continued the page would render no data - so make sure to always check the cache retrieval result. Always! If there is data the it's loaded and the data.html data is restored back into the document by simply injecting the HTML back into the document's #SizingContainer element:$("#SizingContainer").html(data.html); It's that simple and it's quite quick even with a fully loaded list of additional items and on a phone. The actual HTML data is stored to the cache on every page load initially and then again when the user clicks on an element to navigate to a particular listing. The former ensures that the client cache always has something in it, and the latter updates with additional information for the selected element. For the click handling I use a data-id attribute on the list item (.postitem) in the list and retrieve the id from that. That id is then used to navigate to the actual entry as well as storing that Id value in the saved cached data. The id is used to reset the selection by searching for the data-id value in the restored elements. The overall process of this save/restore process is pretty straight forward and it doesn't require a bunch of code, yet it yields a huge improvement in the usability of the site on mobile devices (or anybody who uses the non-frames view). Some things to watch out for As easy as it conceptually seems to simply store and retrieve cached content, you have to be quite aware what type of content you are caching. The code above is all that's specific to cache/restore cycle and it works, but it took a few tweaks to the rest of the script code and server code to make it all work. There were a few gotchas that weren't immediately obvious. Here are a few things to pay attention to: Event Handling Logic Timing of manipulating DOM events Inline Script Code Bookmarking to the Cache Url when no cache exists Do you have inline script code in your HTML? That script code isn't going to run if you restore from cache and simply assign or it may not run at the time you think it would normally in the DOM rendering cycle. JavaScript Event Hookups The biggest issue I ran into with this approach almost immediately is that originally I had various static event handlers hooked up to various UI elements that are now cached. If you have an event handler like:$("#btnSearch").click( function() {…}); that works fine when the page loads with server rendered HTML, but that code breaks when you now load the HTML from cache. Why? Because the elements you're trying to hook those events to may not actually be there - yet. Luckily there's an easy workaround for this by using deferred events. With jQuery you can use the .on() event handler instead:$("#SelectionContainer").on("click","#btnSearch", function() {…}); which monitors a parent element for the events and checks for the inner selector elements to handle events on. This effectively defers to runtime event binding, so as more items are added to the document bindings still work. For any cached content use deferred events. Timing of manipulating DOM Elements Along the same lines make sure that your DOM manipulation code follows the code that loads the cached content into the page so that you don't manipulate DOM elements that don't exist just yet. Ideally you'll want to check for the condition to restore cached content towards the top of your script code, but that can be tricky if you have components or other logic that might not all run in a straight line. Inline Script Code Here's another small problem I ran into: I use a DateTime Picker widget I built a while back that relies on the jQuery date time picker. I also created a helper function that allows keyboard date navigation into it that uses JavaScript logic. Because MVC's limited 'object model' the only way to embed widget content into the page is through inline script. This code broken when I inserted the cached HTML into the page because the script code was not available when the component actually got injected into the page. As the last bullet - it's a matter of timing. There's no good work around for this - in my case I pulled out the jQuery date picker and relied on native <input type="date" /> logic instead - a better choice these days anyway, especially since this view is meant to be primarily to serve mobile devices which actually support date input through the browser (unlike desktop browsers of which only WebKit seems to support it). Bookmarking Cached Urls When you cache HTML content you have to make a decision whether you cache on the client and also not render that same content on the server. In the Classifieds app I didn't render server side content so if the user comes to the page with back=True and there is no cached content I have to a have a Plan B. Typically this happens when somebody ends up bookmarking the back URL. The easiest and safest solution for this scenario is to ALWAYS check the cache result to make sure it exists and if not have a safe URL to go back to - in this case to the plain uncached list URL which amounts to effectively redirecting. This seems really obvious in hindsight, but it's easy to overlook and not see a problem until much later, when it's not obvious at all why the page is not rendering anything. Don't use <body> to replace Content Since we're practically replacing all the HTML in the page it may seem tempting to simply replace the HTML content of the <body> tag. Don't. The body tag usually contains key things that should stay in the page and be there when it loads. Specifically script tags and elements and possibly other embedded content. It's best to create a top level DOM element specifically as a placeholder container for your cached content and wrap just around the actual content you want to replace. In the app above the #SizingContainer is that container. Other Approaches The approach I've used for this application is kind of specific to the existing server rendered application we're running and so it's just one approach you can take with caching. However for server rendered content caching this is a pattern I've used in a few apps to retrofit some client caching into list displays. In this application I took the path of least resistance to the existing server rendering logic. Here are a few other ways that come to mind: Using Partial HTML Rendering via AJAXInstead of rendering the page initially on the server, the page would load empty and the client would render the UI by retrieving the respective HTML and embedding it into the page from a Partial View. This effectively makes the initial rendering and the cached rendering logic identical and removes the server having to decide whether this request needs to be rendered or not (ie. not checking for a back=true switch). All the logic related to caching is made on the client in this case. Using JSON Data and Client RenderingThe hardcore client option is to do the whole UI SPA style and pull data from the server and then use client rendering or databinding to pull the data down and render using templates or client side databinding with knockout/angular et al. As with the Partial Rendering approach the advantage is that there's no difference in the logic between pulling the data from cache or rendering from scratch other than the initial check for the cache request. Of course if the app is a full on SPA app, then caching may not be required even - the list could just stay in memory and be hidden and reactivated. I'm sure there are a number of other ways this can be handled as well especially using AJAX. AJAX rendering might simplify the logic, but it also complicates search engine optimization since there's no content loaded initially. So there are always tradeoffs and it's important to look at all angles before deciding on any sort of caching solution in general. State of the Session SessionState and LocalStorage are easy to use in client code and can be integrated even with server centric applications to provide nice caching features of content and data. In this post I've shown a very specific scenario of storing HTML content for the purpose of remembering list view data and state and making the browsing experience for lists a bit more friendly, especially if there's dynamically loaded content involved. If you haven't played with sessionStorage or localStorage I encourage you to give it a try. There's a lot of cool stuff that you can do with this beyond the specific scenario I've covered here… Resources Overview of localStorage (also applies to sessionStorage) Web Storage Compatibility Modernizr Test Suite© Rick Strahl, West Wind Technologies, 2005-2013Posted in JavaScript HTML5 ASP.NET MVC Tweet !function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs"); (function() { var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true; po.src = 'https://apis.google.com/js/plusone.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s); })();

Read the article

CodePlex Daily Summary for Sunday, August 10, 2014

CodePlex Daily Summary for Sunday, August 10, 2014Popular ReleasesWinForms MVP: WinForms MVP v1.0.1008.2014: Issues Fixed Issue 1 New Added MessageBus and AppState features. Added tests in support of the MessageBus and AppState features Added dependency injection support for Ninject. Added tests in support of the NinjectPresenterFactory.WP8 Native Access Webserver: Version alpha 0.5.3: Figured I should post a newer version. This build includes pretty broad registry browsing (especially if you can use the AllCapabilities version) and (in the AC version) also fairly broad file system access. It also includes the ability to download .REG files. There have been tons of bugfixes and performance improvements as well, plus a slightly better UI in both the app and the web interface. For more info, please read the forum post here: http://forum.xda-developers.com/showthread.php?t=23...ClosedXML - The easy way to OpenXML: ClosedXML 0.74.0: Many updates. See history.SEToolbox: SEToolbox 01.042.019 Release 1: Added RadioAntenna broadcast name to ship name detail. Added two additional columns for Asteroid material generation for Asteroid Fields. Added Mass and Block number columns to main display. Added Ellipsis to some columns on main display to reduce name confusion. Added correct SE version number in file when saving. Re-added in reattaching Motor when drag/dropping or importing ships (KeenSH have added RotorEntityId back in after removing it months ago). Added option to export and r...Instant Beautiful Browsing: IBB 14.3 Alpha: An alpha release of IBB. After 3 years of the last release this version is made from scratch, with tons of new features like: Make your own IBB aps. HTML 5. Better UI. Extreme Windows 8 resemblance. Photos. Store. Movement TONS of times smother compared to previous versions. Remember that this is AN ALPHA release, I hope I will have "IBB 14" finished by December. The documentation on how to create a new application for IBB will come next monthjQuery List DragSort: jQuery List DragSort 0.5.2: Fixed scrollContainer removing deprecated use of $.browser so should now work with latest version of jQuery. Added the ability to return false in dragEnd to revert sort order Project changes Added nuget package for dragsort https://www.nuget.org/packages/dragsort Converted repository from SVN to MercurialCRM 2013 One Click Navigation: CRM2013OneClickNavigation_1_0_0_4_managed.zip: Fixed some minor issues and added support for the following languages Spanish German French Italian Portuguese Russian Arabic Chinese Japanese Hindi Hebrew Korean Polish ThaiBraintree Client Library: Braintree 2.32.0: Allow credit card verification options to be passed outside of the nonce for PaymentMethod.create Allow billingaddress parameters and billingaddress_id to be passed outside of the nonce for PaymentMethod.create Add Subscriptions to paypal accounts Add PaymentMethod.update Add failonduplicatepaymentmethod option to PaymentMethod.create Add support for dispute webhooksThe Mario Kart 8 App: V1.0.2.1: First Codeplex release. WINDOWS INSTALLER ONLYAspose Java for Docx4j: Aspose.Words vs Docx4j - v 1.0: Release contain the Code Comparison for Features in Docx4j SDK and Aspose.Words What's New ?Following Examples: Accessing Document Properties Add Bookmarks Convert to Formats Delete Bookmarks Working with Comments Feedback and Suggestions Many more examples are available at Aspose Docs. Raise your queries and suggest more examples via Aspose Forums or via this social coding site.File System Security PowerShell Module: NTFSSecurity 2.4.1: Add-Access and Remove-Access now take multiple accoutsYourSqlDba: YourSqlDba 5.2.1.: This version improves alert message that comes a while after you install the script. First it says to get it from YourSqlDba.CodePlex.com If you don't want to update now, just-rerun the script from your installed version. To get actual version running just execute install.PrintVersionInfo. . You can go to source code / history and click on change set 72957 to see changes in the script.Manipulator: Manipulator: manipulatorXNB filetype plugin for Paint.NET: Paint.NET XNB plugin v0.4.0.0: CHANGELOG Reverted old incomplete changes. Updated library for compatibility with Paint .NET 4. Updated project to NET 4.5. Updated version to 0.4.0.0. INSTALLATION INSTRUCTIONS Extract the ZIP file to your Paint.NET\FileTypes folder.EdiFabric: Release 4.1: Changed MessageContextWix# (WixSharp) - managed interface for WiX: Release 1.0.0.0: Release 1.0.0.0 Custom UI Custom MSI Dialog Custom CLR Dialog External UIMath.NET Numerics: Math.NET Numerics v3.2.0: Linear Algebra: Vector.Map2 (map2 in F#), storage-optimized Linear Algebra: fix RemoveColumn/Row early index bound check (was not strict enough) Statistics: Entropy ~Jeff Mastry Interpolation: use Array.BinarySearch instead of local implementation ~Candy Chiu Resources: fix a corrupted exception message string Portable Build: support .Net 4.0 as well by using profile 328 instead of 344. .Net 3.5: F# extensions now support .Net 3.5 as well .Net 3.5: NuGet package now contains pro...Virto Commerce Enterprise Open Source eCommerce Platform (asp.net mvc): Virto Commerce 1.11: Virto Commerce Community Edition version 1.11. To install the SDK package, please refer to SDK getting started documentation To configure source code package, please refer to Source code getting started documentation This release includes many bug fixes and minor improvements. More details about this release can be found on our blog at http://blog.virtocommerce.com.BoxStarter: Boxstarter 2.4.80: Running the Setup.bat file will install Chocolatey if not present and then install the Boxstarter modules.ProjkyAddin ssms addin script shortcut ssmsaddin: projkyaddin source code and msi files.: projkyaddin source code and msi files.New ProjectsBolos: BolosBWQS - The BitWise Query Service: Generic object queries with a bitwise syntax.DocX Razor: A DocX scaffolding engine with Razor syntaxJQuery Simple Logger: Its a very simple jQuery extension for logging client side events. There are four levels of logging: Error, Warning, Info, Debug ???????: ???????QQ:2281595668，?????，????，????　　?????????????????????，??1998?7??????，??????????，?????????，?????????????，????????????????????????. ????????????????????，????????: ?????QQ:2281595668，?????，????，????。???????????????????，??????????????，????，?????????????????????，??????。???????，??????????????????????。????????，????????????，?????????: ???????????: ?????QQ:2281595668，?????，????，????。????????????????????????，????????????，??????98???????????，????，??????????，?????????. 　　?????????,????????????????，????????????????: ?????QQ：2281595668，?????，????，????。??????????????，?????????????????????，???????????????????????!?????????????????????????????????????????????、?????????、??????、???????: ???????????: ?????QQ：2281595668，?????，????，????。???????????????????，??1998?7??????，??????????，?????????，?????????????，??????????????????????. ????????????????????，????????????????: ????????????: ???????????: ?????QQ：2281595668，?????，????，????。???????????????????，??????????????，????，?????????????????????，??????。??，??????????????????????。????????，????????????，??????，???????: ??????QQ:2281595668，?????，????，????。??????????????????，????????。????????????????、???????。??????????????。?????????????????,??????,??????,??????,??????????????，????????: ??????QQ:2281595668，?????，????，????　　????????????????????，????????。????????????????、???????。??????????????。???????????????????,??????,??????,??????,??????????????????: ???????????: ??????????: ?????QQ：2281595668，?????，????，????。???????????????????，??1998?7??????，??????????，?????????，?????????????，??????????????????????. ????????????????????，????????????????: ??????QQ:2281595668，?????，????，????　　 ????????????????????，??1998?7??????，??????????，??????? ????????，?????????????， ???????????????????????. ???????????????????????: ?????QQ:2281595668，?????，????，????。??????????????，??????、????、?????????????????????????，???????????? ??。???????????，??????????，???????????，????2000?，??????????，??????: ????????????: ??????QQ:2281595668，?????，????，????　　?????2004?，??????????????，??????????????????。?????? ?????，????????????????，????????????。????，????????????，????，??“??????”????????: ??????QQ:2281595668，?????，????，????。??????????????????????????，????????????!??????????????????????????????????????????、???????、????、??????、??????????。???????????????: ?????QQ：2281595668，?????，????，????。??????????????，?????????????????????，???????????????????????!?????????????????????????????????????????????、?????????、??????、???????: ???????????: ?????QQ:2281595668，?????，????，????。?????????????????，????????。????????????????、???????。??????????????。????????????????,??????,??????,??????,??????????????，????,?????: ?????QQ：2281595668，?????，????，????。　　??????98???????????，???????????????????，????????????，????，??????????，?????????，?????????,????????????????，???????????，??????????: ??????????QQ:2281595668，?????，????，????　　?????2004?，??????????????，??????????????????。?????? ?????，????????????????，????????????。????，???????????，????，??“???????????: ?????QQ：2281595668，?????，????，????。??????????????，??????、????、?????????????????????????，???????????? ??。???????????，??????????，???????????，????2000?，??????????，?????: ?????QQ：2281595668，?????，????，????。??????????????，?????????????????????????，????????????!?????????????????????????????????????????、???????、????、??????、???????????????: ????????????: ???????????: ?????QQ：2281595668，?????，????，????。???????????????????，??1998?7??????，??????????，?????????，?????????????，??????????????????????. ????????????????????，???????????????: ?????QQ：2281595668，?????，????，????。?????????????????，????????。????????????????、???????。??????????????。????????????????,??????,??????,??????,??????????????，????,?????: ?????QQ：2281595668，?????，????，????。　　??????98???????????，???????????????????，????????????，????，??????????，?????????，?????????,????????????????，???????????，??????????: ?????QQ:2281595668，?????，????，????。?????????????????!????????????????????????????????????????????、?????????、??????、????????、????????????。??????????，???????????，???????: ??????????????QQ:2281595668，?????，????，????　　????? ????????、??、??、??????????????????，???????，???????，?????????????，??????????????，?????、??????????、??、???，???????????: ?????QQ：2281595668，?????，????，????。??????????????????????????,??????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;????;????;??????: ?????QQ：2281595668，?????，????，????。??????????????，?????????????????????????，????????????!?????????????????????????????????????????、???????、????、??????、??????????????: ???????????: ????????????: ????????????: ????????????: ????????????QQ:2281595668，?????，????，????　　???????????1998?????????。????????????，???????????????，?????????????，???????????，?2003?????????????，????????????????????????: ?????????????: ???????QQ：2281595668，?????，????，????。???????????????????!????????????????????????????????????????????、?????????、??????、????????、????????????。??????????，??????????????: ??????QQ：2281595668，?????，????，????。???????????????????????????,???????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;????;????????: ?????QQ：2281595668，?????，????，????。??????????1998?????????。????????????，???????????????，?????????????，???????????，?2003?????????????，????????????????????????????????: ?????QQ:2281595668，?????，????，????。????????????????????????，????????????，??????98???????????，????，??????????，?????????. 　　?????????,????????????????，????????????????: ?????QQ:2281595668，?????，????，????。?????????????????，????????。????????????????、???????。??????????????。????????????????,??????,??????,??????,??????????????，????,?????: ?????QQ：2281595668，?????，????，????。??????????????，?????????????????????，???????????????????????!?????????????????????????????????????????????、?????????、??????、??????: ?????QQ:2281595668，?????，????，????。??????????????，??????、????、?????????????????????????，???????????? ??。???????????，??????????，???????????，????2000?，??????????，?????: ?????QQ：2281595668，?????，????，????。???????????????????，??1998?7??????，??????????，?????????，?????????????，??????????????????????. ????????????????????，???????????????: ?????QQ:2281595668，?????，????，????　　????????????????????，????????。????????????????、???????。??????????????。???????????????????,??????,??????,??????,??????????????????: ?????QQ：2281595668，?????，????，????。??????????1998?????????。????????????，???????????????，?????????????，???????????，?2003?????????????，?????????????????????????????????: ???????????: ?????QQ:2281595668，?????，????，????。??????????????，??????、????、?????????????????????????，???????????? ??。???????????，??????????，???????????，????2000?，??????????，??????: ???????????: ?????QQ：2281595668，?????，????，????。??????????1998?????????。????????????，???????????????，?????????????，???????????，?2003?????????????，????????????????????????????????: ?????QQ:2281595668，?????，????，????。???????????????????，??????????????，????，?????????????????????，??????。??，??????????????????????。????????，????????????，??????，??????: ?????QQ：2281595668，?????，????，????。??????????????????????????,??????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;????;????;??????: ?????QQ:2281595668，?????，????，????。????????????????????????，????????????，??????98???????????，????，??????????，?????????. 　　?????????,????????????????，?????????????????: ??????QQ:2281595668，?????，????，????　　????? ????????、??、??、??????????????????，???????，???????，?????????????，??????????????，?????、??????????、??、???，???????? ????????????: ?????????????QQ:2281595668，?????，????，????　　???????????????????，????????????，???????98???????????，????，??????????，?????????. 　　?????????,????????????????，???????????: ?????QQ:2281595668，?????，????，????。??????????????????????????,??????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;????;????;??????: ?????QQ:2281595668，?????，????，????　　?????2004?，??????????????，??????????????????。?????? ?????，????????????????，????????????。????，???????????，????，??“??????”?????????: ?????QQ:2281595668，?????，????，????。???????????????????，??????????????，????，?????????????????????，??????。???????，??????????????????????。????????，????????????，????????: ?????QQ：2281595668，?????，????，????。???????????????????，??????????????，????，?????????????????????，??????。??，??????????????????????。????????，????????????，??????，???????: ??????QQ:2281595668，?????，????，????。?????????????????????????，????????????，???????98???????????，????，??????????，?????????. 　　?????????,????????????????，?????????????: ?????QQ:2281595668，?????，????，????。???????????????????，??????????????，????，?????????????????????，??????。??，??????????????????????。????????，????????????，??????，??????: ?????QQ:2281595668，?????，????，????。??????????????，?????????????????????，???????????????????????!?????????????????????????????????????????????、?????????、??????、??????: ??????????: ?????QQ：2281595668，?????，????，????。?????????????????，????????。????????????????、???????。??????????????。????????????????,??????,??????,??????,??????????????，????,??????: ???????????: ?????QQ：2281595668，?????，????，????。???????????????????，??????????????，????，?????????????????????，??????。??，??????????????????????。????????，????????????，??????，??????: ?????QQ:2281595668，?????，????，????　　???????????????????，????????????，??????98???????????，????，??????????，?????????. 　　?????????,????????????????，???????????，????????: ?????QQ：2281595668，?????，????，????。??????????????，?????????????????????????，????????????!?????????????????????????????????????????、???????、????、??????、??????????????: ?????QQ:2281595668，?????，????，????。??????????????，??????、????、?????????????????????????，???????????? ??。???????????，??????????，???????????，????2000?，??????????，??????: ???????????: ?????QQ：2281595668，?????，????，????。??????????????，?????????????????????，???????????????????????!?????????????????????????????????????????????、?????????、??????、???????: ?????????????: ??????????????QQ:2281595668，?????，????，????　　?????????????????????，??1998?7??????，??????????，?????????，?????????????，????????????????????????. ??????????????????????: ???????????: ????????????: ??????QQ:2281595668，?????，????，????　　???????????????????????????,???????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;????;???????: ?????QQ：2281595668，?????，????，????。?????????，??????????????????。?????? ?????，????????????????，????????????。????，???????????，????，??“??????”???? ?????，???????????????: ?????QQ:2281595668，?????，????，????　　??????????????????????????,??????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;????;????;?????: ?????QQ:2281595668，?????，????，????。?????????????????????????，????????????!?????????????????????????????????????????、???????、????、??????、??????????。??????????????????: ?????QQ：2281595668，?????，????，????。?????????，??????????????????。?????? ?????，????????????????，????????????。????，???????????，????，??“??????”???? ?????，???????????????: ??????????: ?????QQ:2281595668，?????，????，????　　?????2004?，??????????????，??????????????????。?????? ?????，????????????????，????????????。????，???????????，????，??“??????”??????????: ??????QQ:2281595668，?????，????，????。???????????????，??????、????、?????????????????????????，???????????? ??。???????????，??????????，???????????，????2000?，??????????????: ?????QQ：2281595668，?????，????，????。?????????，??????????????????。?????? ?????，????????????????，????????????。????，???????????，????，??“??????”???? ?????，????????????????: ????????????QQ:2281595668，?????，????，????　　????? ????????、??、??、??????????????????，???????，???????，?????????????，??????????????，?????、??????????、??、???，?????????????: ?????QQ：2281595668，?????，????，????。?????????????、??、??、??????????????????，???????，???????，?????????????，??????????????，?????、??????????、??、???，?????????????，????????: ?????QQ：2281595668，?????，????，????。　　??????98???????????，???????????????????，????????????，????，??????????，?????????，?????????,????????????????，???????????，??????????: ?????QQ:2281595668，?????，????，????　　??????????????，?????????????????????，???????????????????????!?????????????????????????????????????????????、?????????、??????、??????: ??????QQ:2281595668，?????，????，????　　???????????????????，????????????，???????98???????????，????，??????????，?????????. 　　?????????,????????????????，???????????，???????: ????????????: ?????????????: hhhtbjzjgh??????: ??????QQ：2281595668，?????，????，????。??????????????????!????????????????????????????????????????????、?????????、??????、????????、????????????。??????????，???????????????: ?????QQ:2281595668，?????，????，????。??????????????，?????????????????????，???????????????????????!?????????????????????????????????????????????、?????????、??????、??????: ?????QQ:2281595668，?????，????，????。???????????????????，??????????????，????，?????????????????????，??????。??，??????????????????????。????????，????????????，??????，???????: ???????????: ?????QQ:2281595668，?????，????，????。??????????????，??????、????、?????????????????????????，???????????? ??。???????????，??????????，???????????，????2000?，??????????，?????: ?????QQ:2281595668，?????，????，????。　　?????????????、??、??、??????????????????，???????，???????，?????????????，??????????????，?????、??????????、??、???，?????????????，???????: ??????QQ:2281595668，?????，????，????。??????????????????!????????????????????????????????????????????、?????????、??????、????????、????????????。??????????，????????????????: ??????QQ:2281595668，?????，????，????　　???????????????????????????,???????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;????;????????: ??????QQ:2281595668，?????，????，????　　???????????????????????????,???????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;????;???????: ?????QQ:2281595668，?????，????，????。???????????????????，??????????????，????，?????????????????????，??????。??，??????????????????????。????????，????????????，??????，???????: ??????QQ：2281595668，?????，????，????。???????????1998?????????。????????????，???????????????，?????????????，???????????，?2003?????????????，??????????????????????????????: ?????QQ：2281595668，?????，????，????。?????????????????!????????????????????????????????????????????、?????????、??????、????????、????????????。??????????，???????????，??????: ??????QQ:2281595668，?????，????，????。???????????????，??????、????、?????????????????????????，???????????? ??。???????????，??????????，???????????，????2000?，??????????????: ?????QQ:2281595668，?????，????，????。??????????????????????????,??????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;????;????;???????: ??????QQ:2281595668，?????，????，????。???????????????，?????????????????????，????????????????????????!??????????????????????????????????????????????、?????????、??????????: ????????????QQ:2281595668，?????，????，????　　???????????????，?????????????????????，????????????????????????!??????????????????????????????????????????????、?????????????: ???????????: ?????QQ:2281595668，?????，????，????。?????????????????，????????。????????????????、???????。??????????????。????????????????,??????,??????,??????,??????????????，????,?????: ?????QQ：2281595668，?????，????，????。?????????????????!????????????????????????????????????????????、?????????、??????、????????、????????????。??????????，???????????，?????: ?????QQ：2281595668，?????，????，????。???????????????????，??1998?7??????，??????????，?????????，?????????????，??????????????????????. ????????????????????，???????????????: ?????QQ:2281595668，?????，????，????　　??????????1998?????????。????????????，???????????????，?????????????，???????????，?2003?????????????，???????????????????????????????: tybjza?????: ?????QQ：2281595668，?????，????，????。?????????，??????????????????。?????? ?????，????????????????，????????????。????，???????????，????，??“??????”???? ?????，????????????????: ??????QQ:2281595668，?????，????，????。　　??????????????、??、??、??????????????????，???????，???????，?????????????，??????????????，?????、??????????、??、???，??????????????????: ?????QQ:2281595668，?????，????，????。?????????????????，????????。????????????????、???????。??????????????。????????????????,??????,??????,??????,??????????????，????,????????: ????????QQ:2281595668，?????，????，????　　?????????????????????????????,?????????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;??????: ?????QQ：2281595668，?????，????，????。??????????????????????????,??????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;????;????;??????: ?????QQ：2281595668，?????，????，????。??????????????，??????、????、?????????????????????????，???????????? ??。???????????，??????????，???????????，????2000?，??????????，?????: ?????QQ：2281595668，?????，????，????。?????????????、??、??、??????????????????，???????，???????，?????????????，??????????????，?????、??????????、??、???，?????????????，????????: ?????QQ：2281595668，?????，????，????。?????????????????，????????。????????????????、???????。??????????????。????????????????,??????,??????,??????,??????????????，????,??????: ????????????QQ:2281595668，?????，????，????　　???????????1998?????????。????????????，???????????????，?????????????，???????????，?2003?????????????，???????????????????????: ?????QQ:2281595668，?????，????，????。?????????????????????????，????????????!?????????????????????????????????????????、???????、????、??????、??????????。??????????????????: ?????QQ:2281595668，?????，????，????。?????????????????，????????。????????????????、???????。??????????????。????????????????,??????,??????,??????,??????????????，????,?????: ?????QQ：2281595668，?????，????，????。??????????1998?????????。????????????，???????????????，?????????????，???????????，?2003?????????????，????????????????????????????????: ?????QQ:2281595668，?????，????，????。???????????????????，??????????????，????，?????????????????????，??????。???????，??????????????????????。????????，????????????，????????: ?????QQ：2281595668，?????，????，????。?????????，??????????????????。?????? ?????，????????????????，????????????。????，???????????，????，??“??????”???? ?????，???????????????: ?????QQ：2281595668，?????，????，????。?????????????????!????????????????????????????????????????????、?????????、??????、????????、????????????。??????????，???????????，??????: ??????QQ:2281595668，?????，????，????。??????????????????????????，????????????!??????????????????????????????????????????、???????、????、??????、??????????。????????????????: ??????QQ:2281595668，?????，????，????。???????????????????????????,???????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;????;????????: ????? QQ:2281595668，?????，????，????。????? ???????????????????，????????????，????? ?98???????????，????，??????????，?????????. 　　?????????,????????????????，?????????????: ?????QQ：2281595668，?????，????，????。???????????????????，??1998?7??????，??????????，?????????，?????????????，??????????????????????. ????????????????????，????????????????: ???????????: ?????　QQ：2281595668，?????，????，????。?????　?????????，??????、????、?????????????????????????，???????????? ??。???????????，??????????，???????????，????2000?，???????????????: ??????QQ:2281595668，?????，????，????。??????????????????，????????。????????????????、???????。??????????????。?????????????????,??????,??????,??????,??????????????，???????: ?????QQ：2281595668，?????，????，????。??????????????，?????????????????????，???????????????????????!?????????????????????????????????????????????、?????????、??????、???????: ??????QQ:2281595668，?????，????，????　　????? ????????、??、??、??????????????????，???????，???????，?????????????，??????????????，?????、??????????、??、???，???????? ????????????: ???????QQ:2281595668，?????，????，????　　???????????????????，????????????，????????98???????????，????，??????????，?????????. 　　?????????,????????????????，?????????????????: ??????QQ:2281595668，?????，????，????。??????????????????，????????。????????????????、???????。??????????????。?????????????????,??????,??????,??????,??????????????，???????: ??????????: ?????QQ：2281595668，?????，????，????。??????????1998?????????。????????????，???????????????，?????????????，???????????，?2003?????????????，?????????????????????????????????: ????????????QQ:2281595668，?????，????，????　　?????2004?，??????????????，??????????????????。?????? ?????，????????????????，????????????。????，????????????，????，??“????????: ?????QQ:2281595668，?????，????，????。?????????????????，????????。????????????????、???????。??????????????。????????????????,??????,??????,??????,??????????????，????,??????: ???????????: ??????????: ?????QQ：2281595668，?????，????，????。??????????????，?????????????????????，???????????????????????!?????????????????????????????????????????????、?????????、??????、??????: ?????QQ:2281595668，?????，????，????　　????????????????????，????????。????????????????、???????。??????????????。???????????????????,??????,??????,??????,??????????????????: ?????QQ:2281595668，?????，????，????。??????????????????????????,??????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;????;????;??????: ?????QQ：2281595668，?????，????，????。??????????1998?????????。????????????，???????????????，?????????????，???????????，?2003?????????????，?????????????????????????????????: ????????????: ??????QQ:2281595668，?????，????，????　　???????????????????????????,???????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;????;???????: ?????QQ：2281595668，?????，????，????。??????????????，??????、????、?????????????????????????，???????????? ??。???????????，??????????，???????????，????2000?，??????????，??????: ??????QQ:2281595668，?????，????，????。???????????????，??????、????、?????????????????????????，???????????? ??。???????????，??????????，???????????，????2000?，??????????????: ?????QQ:2281595668，?????，????，????。?????????????????????????，????????????!?????????????????????????????????????????、???????、????、??????、??????????。???????????????????: ????????????: ??????QQ:2281595668，?????，????，????。??????????????????，????????。????????????????、???????。??????????????。?????????????????,??????,??????,??????,??????????????，????????: ????????????QQ:2281595668，?????，????，????　　????????????????????，????????。????????????????、???????。??????????????。???????????????????,??????,??????,??????,????????????: ??????QQ:2281595668，?????，????，????。??????????????????，????????。????????????????、???????。??????????????。?????????????????,??????,??????,??????,??????????????，???????: ?????QQ：2281595668，?????，????，????。?????????????????!????????????????????????????????????????????、?????????、??????、????????、????????????。??????????，???????????，??????: ???????????: ?????QQ:2281595668，?????，????，????。???????????????????，??????????????，????，?????????????????????，??????。??，??????????????????????。????????，????????????，??????，???????: ??????QQ：2281595668，?????，????，????。???????????1998?????????。????????????，???????????????，?????????????，???????????，?2003?????????????，???????????????????????????????: ????????????QQ:2281595668，?????，????，????　　?????2004?，??????????????，??????????????????。?????? ?????，????????????????，????????????。????，????????????，????，??“?????????: ???????????: ?????QQ:2281595668，?????，????，????。?????????????????，????????。????????????????、???????。??????????????。????????????????,??????,??????,??????,??????????????，????,?????: ??????????: ??????　 ??????　 ??????　 ??????　 ??????　 ?????　 ?????　 ??????　 ?????　 ????????????: ??????QQ:2281595668，?????，????，????。??????????????????!????????????????????????????????????????????、?????????、??????、????????、????????????。??????????，????????????????: ??????QQ:2281595668，?????，????，????。　　??????????????、??、??、??????????????????，???????，???????，?????????????，??????????????，?????、??????????、??、???，??????????????????: ?????QQ：2281595668，?????，????，????。?????????????、??、??、??????????????????，???????，???????，?????????????，??????????????，?????、??????????、??、???，?????????????，?????????: ??????QQ:2281595668，?????，????，????。　　??????????????、??、??、??????????????????，???????，???????，?????????????，??????????????，?????、??????????、??、???，??????????????????: ?????QQ:2281595668，?????，????，????。?????????????????!????????????????????????????????????????????、?????????、??????、????????、????????????。??????????，???????????，??????: ???????????: ?????QQ：2281595668，?????，????，????。?????????????、??、??、??????????????????，???????，???????，?????????????，??????????????，?????、??????????、??、???，?????????????，????????: ???????????: ??????QQ:2281595668，?????，????，????。??????????????????????????，????????????!??????????????????????????????????????????、???????、????、??????、??????????。???????????????: ?????QQ：2281595668，?????，????，????。?????????????、??、??、??????????????????，???????，???????，?????????????，??????????????，?????、??????????、??、???，?????????????，?????????: ???????????: ?????QQ:2281595668，?????，????，????。??????????????????????????,??????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;????;????;???????: ????????????: ??????QQ:2281595668，?????，????，????　　????????????????????，????????。????????????????、???????。??????????????。???????????????????,??????,??????,??????,???????????????????: ??????????????QQ:2281595668，?????，????，????　　???????????????????，????????????，????????98???????????，????，??????????，?????????. 　　?????????,????????????????，?????????: ??????????: ?????QQ：2281595668，?????，????，????。??????????????，?????????????????????????，????????????!?????????????????????????????????????????、???????、????、??????、??????????????: ???????????: ??????QQ:2281595668，?????，????，????　　?????2004?，??????????????，??????????????????。?????? ?????，????????????????，????????????。????，????????????，????，??“??????”????????: ???????????: ?????QQ：2281595668，?????，????，????。　　??????98???????????，???????????????????，????????????，????，??????????，?????????，?????????,????????????????，???????????，??????????: ?????QQ:2281595668，?????，????，????　　??????????????????????????,??????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;????;????;?????: ??????????QQ:2281595668，?????，????，????　　??????????1998?????????。????????????，???????????????，?????????????，???????????，?2003?????????????，??????????????????????????: ?????QQ:2281595668，?????，????，????。?????????????????!????????????????????????????????????????????、?????????、??????、????????、????????????。??????????，???????????，?????: ?????QQ:2281595668，?????，????，????　　????????????????????，????????。????????????????、???????。??????????????。???????????????????,??????,??????,??????,???????????????????: ??????QQ:2281595668，?????，????，????。???????????????????????????,???????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;????;?????????: ???????????: ?????QQ：2281595668，?????，????，????。??????????????，?????????????????????，???????????????????????!?????????????????????????????????????????????、?????????、??????、??????: ?????QQ:2281595668，?????，????，????。??????????????，?????????????????????，???????????????????????!?????????????????????????????????????????????、?????????、??????、???????: ??????QQ:2281595668，?????，????，????。??????????????????，????????。????????????????、???????。??????????????。?????????????????,??????,??????,??????,??????????????，???????: ?????QQ:2281595668，?????，????，????。???????????????????，??????????????，????，?????????????????????，??????。???????，??????????????????????。????????，????????????，?????????: ??????QQ:2281595668，?????，????，????。???????????????????????????,???????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;????;?????????: ????????????: ?????????????: ???????QQ:2281595668，?????，????，????　　????????????????????????????,????????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;??????????: ??????QQ:2281595668，?????，????，????。????????????????????，??????????????，????，?????????????????????，??????。????????，??????????????????????。????????，????????????，?????: ???????????: ?????? ??????: ??????QQ:2281595668，?????，????，????。????????????????????，??????????????，????，?????????????????????，??????。??，??????????????????????。????????，????????????，????????????: ??????QQ:2281595668，?????，????，????。?????????????????????????，????????????，???????98???????????，????，??????????，?????????. 　　?????????,????????????????，?????????????: ?????QQ：2281595668，?????，????，????。???????????????????，??????????????，????，?????????????????????，??????。??，??????????????????????。????????，????????????，??????，???????: ????????????: ????????????QQ:2281595668，?????，????，????　　????????????????????，????????。????????????????、???????。??????????????。???????????????????,??????,??????,??????,????????????: ??????QQ:2281595668，?????，????，????　　?????2004?，??????????????，??????????????????。?????? ?????，????????????????，????????????。????，????????????，????，??“??????”???????: ?????QQ:2281595668，?????，????，????。?????????????????，????????。????????????????、???????。??????????????。????????????????,??????,??????,??????,??????????????，????,??????: ???????????: ?????QQ：2281595668，?????，????，????。??????????1998?????????。????????????，???????????????，?????????????，???????????，?2003?????????????，????????????????????????????????: ?????QQ:2281595668，?????，????，????。???????????????????，??????????????，????，?????????????????????，??????。???????，??????????????????????。????????，????????????，????????: ?????QQ：2281595668，?????，????，????。?????????????????!????????????????????????????????????????????、?????????、??????、????????、????????????。??????????，???????????，?????: ?????QQ:2281595668，?????，????，????。?????????????????!????????????????????????????????????????????、?????????、??????、????????、????????????。??????????，???????????，???????: ??????????????QQ:2281595668，?????，????，????　　????????????????????，????????。????????????????、???????。??????????????。???????????????????,??????,??????,??????,?????????: ?????QQ：2281595668，?????，????，????。?????????????、??、??、??????????????????，???????，???????，?????????????，??????????????，?????、??????????、??、???，?????????????，?????????: ????????????QQ:2281595668，?????，????，????　　???????????????，?????????????????????，????????????????????????!??????????????????????????????????????????????、?????????????: ???????????: ?????QQ：2281595668，?????，????，????。?????????，??????????????????。?????? ?????，????????????????，????????????。????，???????????，????，??“??????”???? ?????，????????????????: ????????????: ???????????: ?????QQ:2281595668，?????，????，????。??????????????，?????????????????????，???????????????????????!?????????????????????????????????????????????、?????????、??????、??????: ?????QQ：2281595668，?????，????，????。　　??????98???????????，???????????????????，????????????，????，??????????，?????????，?????????,????????????????，???????????，??????????: ?????QQ：2281595668，?????，????，????。?????????????、??、??、??????????????????，???????，???????，?????????????，??????????????，?????、??????????、??、???，?????????????，?????????: ??????QQ：2281595668，?????，????，????。???????????????，?????????????????????，????????????????????????!??????????????????????????????????????????????、?????????、?????????: ?????QQ：2281595668，?????，????，????。???????????????????，??????????????，????，?????????????????????，??????。??，??????????????????????。????????，????????????，??????，?????????: ????????????????QQ:2281595668，?????，????，????　　?????2004?，??????????????，??????????????????。?????? ?????，????????????????，????????????。????，??????????????，????，??????: ???????????: ?????QQ：2281595668，?????，????，????。?????????????????，????????。????????????????、???????。??????????????。????????????????,??????,??????,??????,??????????????，????,?????: ?????QQ：2281595668，?????，????，????。?????????????????，????????。????????????????、???????。??????????????。????????????????,??????,??????,??????,??????????????，????,?????: ?????QQ：2281595668，?????，????，????。??????????????????????????,??????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;????;????;??????: ??????????: ???????????: ????????????: ??????QQ:2281595668，?????，????，????。???????????????，?????????????????????，????????????????????????!??????????????????????????????????????????????、?????????、???????????: ???????QQ:2281595668，?????，????，????。　　???????????????、??、??、??????????????????，???????，???????，?????????????，??????????????，?????、??????????、??、???，?????????????????: ???????????: ?????QQ：2281595668，?????，????，????。???????????????????，??1998?7??????，??????????，?????????，?????????????，??????????????????????. ????????????????????，???????????????: ?????QQ：2281595668，?????，????，????。?????????????????，????????。????????????????、???????。??????????????。????????????????,??????,??????,??????,??????????????，????,??????: ??????QQ:2281595668，?????，????，????　　????????????????????，????????。????????????????、???????。??????????????。???????????????????,??????,??????,??????,??????????????????: ??????QQ:2281595668，?????，????，????　　????????????????????，????????。????????????????、???????。??????????????。???????????????????,??????,??????,??????,??????????????????: ??????QQ:2281595668，?????，????，????。?????????????????????????，????????????，???????98???????????，????，??????????，?????????. 　　?????????,????????????????，?????????????: ?????QQ：2281595668，?????，????，????。?????????????????，????????。????????????????、???????。??????????????。????????????????,??????,??????,??????,??????????????，????,?????: ???????????: ???????????: ?????QQ:2281595668，?????，????，????　　????? ????????、??、??、??????????????????，???????，???????，?????????????，??????????????，?????、??????????、??、???，???????? ?????，?????: ?????QQ：2281595668，?????，????，????。??????????????，??????、????、?????????????????????????，???????????? ??。???????????，??????????，???????????，????2000?，??????????，??????: ??????QQ:2281595668，?????，????，????　　???????????????????????????,???????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;????;???????: ?????QQ:2281595668，?????，????，????。　　?????????????、??、??、??????????????????，???????，???????，?????????????，??????????????，?????、??????????、??、???，?????????????，??????: ?????QQ：2281595668，?????，????，????。??????????????????????????,??????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;????;????;???????: ??????QQ:2281595668，?????，????，????　　????????????????????，??1998?7??????，??????????，?????????，?????????????，???????????????????????. ????????????????????，????????????: ???????????: ?????QQ：2281595668，?????，????，????。??????????????，??????、????、?????????????????????????，???????????? ??。???????????，??????????，???????????，????2000?，??????????，?????: ?????QQ：2281595668，?????，????，????。?????????????、??、??、??????????????????，???????，???????，?????????????，??????????????，?????、??????????、??、???，?????????????，?????????: ????????????: ????????????QQ:2281595668，?????，????，????　　????????????????????，????????。????????????????、???????。??????????????。???????????????????,??????,??????,??????,???????????: ?????QQ:2281595668，?????，????，????。?????????????????????????，????????????!?????????????????????????????????????????、???????、????、??????、??????????。???????????????????: ???????????: ?????QQ:2281595668，?????，????，????。?????????????????，????????。????????????????、???????。??????????????。????????????????,??????,??????,??????,??????????????，????,??????: ??????QQ:2281595668，?????，????，????　　????????????????????，????????。????????????????、???????。??????????????。???????????????????,??????,??????,??????,??????????????????: ????????????: ??????QQ:2281595668，?????，????，????　　???????????????，?????????????????????，????????????????????????!??????????????????????????????????????????????、?????????、????????: ?????QQ:2281595668，?????，????，????。???????????????????，??????????????，????，?????????????????????，??????。??，??????????????????????。????????，????????????，??????，??????: ?????QQ:2281595668，?????，????，????。?????????????????，????????。????????????????、???????。??????????????。????????????????,??????,??????,??????,??????????????，????,?????: ?????QQ：2281595668，?????，????，????。??????????????????????????,??????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;????;????;??????: ?????QQ：2281595668，?????，????，????。??????????????，?????????????????????????，????????????!?????????????????????????????????????????、???????、????、??????、??????????????: ?????QQ：2281595668，?????，????，????。??????????????，??????、????、?????????????????????????，???????????? ??。???????????，??????????，???????????，????2000?，??????????，??????: ????????????QQ:2281595668，?????，????，????　　????? ????????、??、??、??????????????????，???????，???????，?????????????，??????????????，?????、??????????、??、???，?????????????: ?????QQ：2281595668，?????，????，????。　　??????98???????????，???????????????????，????????????，????，??????????，?????????，?????????,????????????????，???????????，??????????: ???????????: ????????????: ??????QQ：2281595668，?????，????，????。　　???????98???????????，???????????????????，????????????，????，??????????，?????????，?????????,????????????????，???????????，????????: ?????QQ:2281595668，?????，????，????　　????????????????????，????????。????????????????、???????。??????????????。???????????????????,??????,??????,??????,???????????????????: ????????????QQ:2281595668，?????，????，????　　????? ????????、??、??、??????????????????，???????，???????，?????????????，??????????????，?????、??????????、??、???，??????????????: ????????????QQ:2281595668，?????，????，????　　????? ????????、??、??、??????????????????，???????，???????，?????????????，??????????????，?????、??????????、??、???，???????????????: ???????QQ:2281595668，?????，????，????。?????????????????????，??????????????，????，?????????????????????，??????。??，??????????????????????。????????，????????????，??????????: ???????????: ?????QQ:2281595668，?????，????，????。?????????????????，????????。????????????????、???????。??????????????。????????????????,??????,??????,??????,??????????????，????,??????: ??????????????: ????????QQ:2281595668，?????，????，????　　?????????????1998?????????。????????????，???????????????，?????????????，???????????，?2003?????????????，?????????????????????????: ?????QQ：2281595668，?????，????，????。??????????????，??????、????、?????????????????????????，???????????? ??。???????????，??????????，???????????，????2000?，??????????，?????: ?????QQ：2281595668，?????，????，????。???????????????????，??????????????，????，?????????????????????，??????。??，??????????????????????。????????，????????????，??????，??????: ?????QQ:2281595668，?????，????，????。????????????????????????，????????????，??????98???????????，????，??????????，?????????. 　　?????????,????????????????，?????????????????: ????????????: ?????QQ:2281595668，?????，????，????　　????????????????????，????????。????????????????、???????。??????????????。???????????????????,??????,??????,??????,??????????????????: ?????QQ:2281595668，?????，????，????。??????????????????????????,??????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;????;????;???????: ????????????QQ:2281595668，?????，????，????　　???????????????????????????,???????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;??????: ?????QQ：2281595668，?????，????，????。??????????????，?????????????????????，???????????????????????!?????????????????????????????????????????????、?????????、??????、??????: ?????QQ:2281595668，?????，????，????。　　?????????????、??、??、??????????????????，???????，???????，?????????????，??????????????，?????、??????????、??、???，?????????????，???????: ???????????: ?????QQ：2281595668，?????，????，????。　　??????98???????????，???????????????????，????????????，????，??????????，?????????，?????????,????????????????，???????????，??????????: ?????QQ：2281595668，?????，????，????。　　??????98???????????，???????????????????，????????????，????，??????????，?????????，?????????,????????????????，???????????，??????????: ?????QQ：2281595668，?????，????，????。?????????????????!????????????????????????????????????????????、?????????、??????、????????、????????????。??????????，???????????，??????: ????????????: ???????????: ?????QQ:2281595668，?????，????，????。?????????????????????????，????????????!?????????????????????????????????????????、???????、????、??????、??????????。???????????????????: ??????QQ:2281595668，?????，????，????　　???????????????，?????????????????????，????????????????????????!??????????????????????????????????????????????、?????????、??????????: ???????QQ:2281595668，?????，????，????　　????? ????????、??、??、??????????????????，???????，???????，?????????????，??????????????，?????、??????????、??、???，???????? ?????????: ?????QQ:2281595668，?????，????，????　　???????????????????，????????????，??????98???????????，????，??????????，?????????. 　　?????????,????????????????，???????????，????????: ??????????: ?????QQ:2281595668，?????，????，????　　?????2004?，??????????????，??????????????????。?????? ?????，????????????????，????????????。????，???????????，????，??“??????”?????????: ?????QQ：2281595668，?????，????，????。???????????????????，??1998?7??????，??????????，?????????，?????????????，??????????????????????. ????????????????????，???????????????: ?????QQ:2281595668，?????，????，????　　????? ????????、??、??、??????????????????，???????，???????，?????????????，??????????????，?????、??????????、??、???，???????? ?????，??????: ???????????: ?????QQ：2281595668，?????，????，????。???????????????????，??????????????，????，?????????????????????，??????。??，??????????????????????。????????，????????????，??????，???????: ????????????: ??????QQ:2281595668，?????，????，????　　????????????????????，????????。????????????????、???????。??????????????。???????????????????,??????,??????,??????,??????????????????: ??????QQ:2281595668，?????，????，????。???????????????，??????、????、?????????????????????????，???????????? ??。???????????，??????????，???????????，????2000?，???????????????: ??????QQ:2281595668，?????，????，????　　????????????????????，??1998?7??????，??????????，?????????，?????????????，???????????????????????. ????????????????????，???????????: ?????QQ:2281595668，?????，????，????　　?????2004?，??????????????，??????????????????。?????? ?????，????????????????，????????????。????，???????????，????，??“??????”?????????: ?????????????????: ??????????????????: ????????????QQ:2281595668，?????，????，????　　????? ????????、??、??、??????????????????，???????，???????，?????????????，??????????????，?????、??????????、??、???，?????????????: ?????QQ:2281595668，?????，????，????。??????????????，??????、????、?????????????????????????，???????????? ??。???????????，??????????，???????????，????2000?，??????????，?????: ?????QQ:2281595668，?????，????，????。??????????????，??????、????、?????????????????????????，???????????? ??。???????????，??????????，???????????，????2000?，??????????，??????: ???????????: ?????QQ：2281595668，?????，????，????。?????????????????!????????????????????????????????????????????、?????????、??????、????????、????????????。??????????，???????????，??????: ????????????QQ:2281595668，?????，????，????　　?????2004?，??????????????，??????????????????。?????? ?????，????????????????，????????????。????，????????????，????，??“????????: ?????QQ:2281595668，?????，????，????。?????????????????????????，????????????!?????????????????????????????????????????、???????、????、??????、??????????。??????????????????: ?????QQ：2281595668，?????，????，????。?????????，??????????????????。?????? ?????，????????????????，????????????。????，???????????，????，??“??????”???? ?????，???????????????: ?????QQ：2281595668，?????，????，????。?????????????????，????????。????????????????、???????。??????????????。????????????????,??????,??????,??????,??????????????，????,??????: ????????????: ??????QQ:2281595668，?????，????，????　　????? ????????、??、??、??????????????????，???????，???????，?????????????，??????????????，?????、??????????、??、???，???????? ??????????: ?????QQ:2281595668，?????，????，????　　????? ????????、??、??、??????????????????，???????，???????，?????????????，??????????????，?????、??????????、??、???，???????? ?????，?????: ?????QQ:2281595668，?????，????，????。??????????????，?????????????????????，???????????????????????!?????????????????????????????????????????????、?????????、??????、???????: ??????QQ:2281595668，?????，????，????　　???????????????????????????,???????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;????;????????: ??????QQ:2281595668，?????，????，????　　???????????????????????????,???????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;????;????????: ??????QQ:2281595668，?????，????，????　　????? ????????、??、??、??????????????????，???????，???????，?????????????，??????????????，?????、??????????、??、???，???????? ??????????: ?????QQ：2281595668，?????，????，????。??????????????，?????????????????????????，????????????!?????????????????????????????????????????、???????、????、??????、???????????????: ??????QQ:2281595668，?????，????，????。???????????????????????????,???????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;????;?????????: ????????????: ???????????: ?????QQ:2281595668，?????，????，????。??????????????，??????、????、?????????????????????????，???????????? ??。???????????，??????????，???????????，????2000?，??????????，?????: ?????QQ：2281595668，?????，????，????。?????????????????，????????。????????????????、???????。??????????????。????????????????,??????,??????,??????,??????????????，????,?????: ??????????: ????????????: ????????????: ??????????: ????? QQ:2281595668，?????，????，????。????? ?????????，??????、????、?????????????????????????，???????????? ??。???????????，??????????，???????????，????2000?，???????????????: ??????QQ:2281595668，?????，????，????。????????????????????，??????????????，????，?????????????????????，??????。????????，??????????????????????。????????，????????????，??????: ??????QQ:2281595668，?????，????，????　　???????????????????????????,???????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;????;???????: ?????QQ:2281595668，?????，????，????。?????????????????!????????????????????????????????????????????、?????????、??????、????????、????????????。??????????，???????????，??????: ??????QQ:2281595668，?????，????，????　　???????????????????，????????????，???????98???????????，????，??????????，?????????. 　　?????????,????????????????，???????????，??????: ?????QQ：2281595668，?????，????，????。???????????????????，??????????????，????，?????????????????????，??????。??，??????????????????????。????????，????????????，??????，???????: ??????QQ:2281595668，?????，????，????。????????????????????，??????????????，????，?????????????????????，??????。????????，??????????????????????。????????，????????????，????????: ????????QQ:2281595668，?????，????，????　　????????????????????，????????。????????????????、???????。??????????????。???????????????????,??????,??????,??????,??????????????????: ????????QQ:2281595668，?????，????，????　　?????2004?，??????????????，??????????????????。?????? ?????，????????????????，????????????。????，??????????????，????，??“???????????: ???????????: ?????QQ:2281595668，?????，????，????。??????????????，??????、????、?????????????????????????，???????????? ??。???????????，??????????，???????????，????2000?，??????????，??????: ????????????: ??????QQ：2281595668，?????，????，????。????????????????????，??1998?7??????，??????????，?????????，?????????????，???????????????????????. ????????????????????，?????????????: ???????????: ?????QQ:2281595668，?????，????，????　　??????????1998?????????。????????????，???????????????，?????????????，???????????，?2003?????????????，???????????????????????????????: ?????QQ：2281595668，?????，????，????。??????????????????????????,??????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;????;????;???????: ????????????QQ:2281595668，?????，????，????　　????? ????????、??、??、??????????????????，???????，???????，?????????????，??????????????，?????、??????????、??、???，??????????????: ??????QQ:2281595668，?????，????，????。??????????????????，????????。????????????????、???????。??????????????。?????????????????,??????,??????,??????,??????????????，????????: ????????????: ????????????QQ:2281595668，?????，????，????　　?????2004?，??????????????，??????????????????。?????? ?????，????????????????，????????????。????，????????????，????，??“????????: ???????????: ?????????????: ???????QQ:2281595668，?????，????，????。????????????????，?????????????????????，?????????????????????????!???????????????????????????????????????????????、?????????、??????: ??????QQ:2281595668，?????，????，????。???????????????，??????、????、?????????????????????????，???????????? ??。???????????，??????????，???????????，????2000?，??????????????: ?????QQ:2281595668，?????，????，????。??????????????，??????、????、?????????????????????????，???????????? ??。???????????，??????????，???????????，????2000?，??????????，??????: ???????????: ?????QQ:2281595668，?????，????，????。???????????????????，??????????????，????，?????????????????????，??????。???????，??????????????????????。????????，????????????，?????????: ??????QQ:2281595668，?????，????，????。??????????????????????????，????????????!??????????????????????????????????????????、???????、????、??????、??????????。????????????????: ??????QQ:2281595668，?????，????，????。????????????????????，??????????????，????，?????????????????????，??????。????????，??????????????????????。????????，????????????，??????: ??????QQ:2281595668，?????，????，????。?????????????????????????，????????????，???????98???????????，????，??????????，?????????. 　　?????????,????????????????，??????????????: ????????????: ???????????: ?????QQ:2281595668，?????，????，????。??????????????????????????,??????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;????;????;???????: ????????????: ????????????: ??????QQ:2281595668，?????，????，????　　???????????????????，????????????，???????98???????????，????，??????????，?????????. 　　?????????,????????????????，???????????，???????: ??????QQ:2281595668，?????，????，????。???????????????，??????、????、?????????????????????????，???????????? ??。???????????，??????????，???????????，????2000?，???????????????: ??????QQ:2281595668，?????，????，????。???????????????，?????????????????????，????????????????????????!??????????????????????????????????????????????、?????????、?????????: ?????QQ：2281595668，?????，????，????。??????????????，?????????????????????????，????????????!?????????????????????????????????????????、???????、????、??????、??????????????: ?????QQ：2281595668，?????，????，????。??????????????，?????????????????????????，????????????!?????????????????????????????????????????、???????、????、??????、???????????????: ??????QQ:2281595668，?????，????，????。???????????????????????????,???????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;????;????????: ?????QQ:2281595668，?????，????，????　　????????????????????，????????。????????????????、???????。??????????????。???????????????????,??????,??????,??????,??????????????????: ?????QQ:2281595668，?????，????，????。　　?????????????、??、??、??????????????????，???????，???????，?????????????，??????????????，?????、??????????、??、???，?????????????，???????: ??????QQ:2281595668，?????，????，????。??????????????????!????????????????????????????????????????????、?????????、??????、????????、????????????。??????????，????????????????: ???????????: ?????QQ：2281595668，?????，????，????。　　??????98???????????，???????????????????，????????????，????，??????????，?????????，?????????,????????????????，???????????，??????????: ?????QQ：2281595668，?????，????，????。??????????1998?????????。????????????，???????????????，?????????????，???????????，?2003?????????????，?????????????????????????????????: ????????????: ????????????: ??????QQ:2281595668，?????，????，????。????????????????????，??????????????，????，?????????????????????，??????。??，??????????????????????。????????，????????????，????????????: ????????????: ???????????: ?????QQ：2281595668，?????，????，????。?????????，??????????????????。?????? ?????，????????????????，????????????。????，???????????，????，??“??????”???? ?????，???????????????: ?????QQ:2281595668，?????，????，????　　??????????????????????????,??????????,???????????????????????,???????:????,????;?????????????;??;??;????;????????;????;????;?????: ?????QQ：2281595668，?????，????，????。??????????????，??????、????、?????????????????????????，???????????? ??。???????????，??????????，???????????，????2000?，??????????，??????: ??????

Read the article

FCKEditor doesn't set Value property on postback!

- by Shaul

I'm using FCKEditor on my asp.net web page. It appears beautifully, and the editor looks really good on the front end. Only problem is, the .Value property is not being set on the postback. No matter what changes the user makes to the value of the control on the page, when I click "Submit", the .Value property remains blank. I have Googled for other solutions, and most of them are of the variety where there's some conflict with Ajax, such as this and this. My problem is not solved by these solutions; it's much more fundamental than that. I'm not doing anything to do with Ajax; I'm just a simple asp.net newbie with a simple web form, and the value property is not being set on postback, not in IE and not in FF. It appears that at least one other person has had this problem, but no solution yet. Any ideas? Thanks! New information: I tried this out on a "hello world" test web site - and the test web site works 100%. There is obviously a problem on my page, but I have no idea where to begin tracking this down. Here's the markup of my page, in case anyone can see anything obvious that my newbie eyes can't: <%@ Page Language="vb" AutoEventWireup="false" CodeBehind="EmailTemplateEditForm.aspx.vb" Inherits="EEI_App.EmailTemplateEditForm" %> <%@ Register Assembly="FredCK.FCKeditorV2" Namespace="FredCK.FCKeditorV2" TagPrefix="FCKeditorV2" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>EEI - Email Template</title> <link rel="stylesheet" href="EEI.css"> <script language="javascript" id="jssembleWare" src="sembleWare.js"></script> <style type="text/css"> .style1 { height: 251px; } .style2 { width: 2%; height: 251px; } .style3 { height: 490px; } </style> </head> <body> <form id="form1" runat="server"> <%@ register src="header.ascx" tagname="header" tagprefix="uc1" %> <%@ register src="footer.ascx" tagname="footer" tagprefix="uc1" %> <uc1:header ID="header1" runat="server" />  <div class="content">  <div class="boxheader"> Email Template </div> <div class="standardbox">   <div class="errorbox"> <asp:Label ID="lblError" CssClass="ErrorControlStyle" runat="server" EnableViewState="False" Width="100%"></asp:Label> </div> <table class="contenttable"> <tr> <td align="left" valign="top" class="style3"> <div class="actionbox"> <div class="navheadertitle"> Navigation</div> <ul> <li> <asp:LinkButton ID="btnSubmit" CssClass="LinkButtonStyle" runat="server">Submit</asp:LinkButton> </li> <li> <asp:LinkButton ID="btnCancel" CssClass="LinkButtonStyle" runat="server" CausesValidation="false">Cancel</asp:LinkButton> </li> </ul> </div> </td> <td align="left" valign="top" class="style3"> <p> </p> <table> <tr class="MCRSFieldRow"> <td class="MCRSFieldLabelCell"> <asp:Label ID="lblEmailTemplate_TemplateName" CssClass="LabelStyle" runat="server" Width="175">Template Name</asp:Label> </td> <td class="MCRSFieldEditCell"> <asp:TextBox ID="txtEmailTemplate_TemplateName" CssClass="TextBoxStyle" runat="server" Width="100%"></asp:TextBox> </td> <td class="MCRSFieldLabelCell"> <asp:Label ID="lblEmailTemplate_TemplateType" CssClass="LabelStyle" runat="server" Width="175">Template Type</asp:Label> </td> <td class="MCRSFieldEditCell"> <asp:RadioButtonList ID="rblEmailTemplate_TemplateType" CssClass="RadioButtonListStyle" runat="server" RepeatColumns="1" RepeatDirection="Horizontal" Width="135px"> <asp:ListItem Value="1">Cover Letter</asp:ListItem> <asp:ListItem Value="2">Email</asp:ListItem> </asp:RadioButtonList> </td> <td class="MCRSRowRightCell">   </td> </tr> <tr class="MCRSFieldRow"> <td class="MCRSFieldLabelCell"> Composition Date </td> <td class="MCRSFieldEditCell"> <asp:Label ID="lblEmailTemplate_CompositionDate" CssClass="ElementLabelStyle" runat="server" Width="175"></asp:Label> </td> <td class="MCRSFieldLabelCell"> Last Used Date </td> <td class="MCRSFieldEditCell"> <asp:Label ID="lblEmailTemplate_LastUsedDate" CssClass="ElementLabelStyle" runat="server" Width="175"></asp:Label> </td> <td class="MCRSRowRightCell">   </td> </tr> <tr class="MCRSFieldRow"> <td class="MCRSFieldLabelCell"> Composed By </td> <td class="MCRSFieldEditCell" colspan="3"> <asp:Label ID="lblPerson_FirstNames" CssClass="ElementLabelStyle" runat="server"></asp:Label> <asp:Label ID="lblPerson_LastName" CssClass="ElementLabelStyle" runat="server"></asp:Label> </td> <td class="MCRSRowRightCell">   </td> </tr> <tr class="MCRSFieldRow"> <td class="MCRSFieldLabelCell"> <asp:Label ID="lblEmailTemplate_Subject" CssClass="LabelStyle" runat="server" Width="175">Subject</asp:Label> </td> <td class="MCRSFieldEditCell" colspan="3"> <asp:TextBox ID="txtEmailTemplate_Subject" CssClass="TextBoxStyle" runat="server" Width="100%"></asp:TextBox> </td> <td class="MCRSRowRightCell">   </td> </tr> <tr class="MCRSFieldRow"> <td class="style1"> <asp:Label ID="lblEmailTemplate_Body" CssClass="LabelStyle" runat="server" Width="175">Body</asp:Label> </td> <td class="style1" colspan="3"> <FCKeditorV2:FCKeditor ID="FCKeditor1" runat="server" Height="500px"> </FCKeditorV2:FCKeditor> </td> <td class="style2">   </td> </tr> </table> </td> </tr> </table> </div> <p> <a class="InputButtonStyle" href="#_swTopOfPage">Top of Page</a> </p> </div> <uc1:footer ID="footer1" runat="server" /> <p> <asp:TextBox ID="txtEmailTemplate_Body" CssClass="TextAreaStyle" Rows="4" runat="server" Width="100%" Height="16px" Visible="False"></asp:TextBox> </p> </form> </body> </html>

Read the article

Conflict between two Javascripts (MailChimp validation etc. scripts & jQuery hSlides.js)

- by Brian

I have two scripts running on the same page, one is the jQuery.hSlides.js script http://www.jesuscarrera.info/demos/hslides/ and the other is a custom script that is used for MailChimp list signup integration. The hSlides panel can be seen in effect here: http://theatricalbellydance.com. I've turned off the MailChimp script because it was conflicting with the hSlides script, causing it not to to fail completely (as seen here http://theatricalbellydance.com/home2/). Can someone tell me what could be done to the hSlides script to stop the conflict with the MailChimp script? The MailChimp Script var fnames = new Array(); var ftypes = new Array(); fnames[0] = 'EMAIL'; ftypes[0] = 'email'; fnames[3] = 'MMERGE3'; ftypes[3] = 'text'; fnames[1] = 'FNAME'; ftypes[1] = 'text'; fnames[2] = 'LNAME'; ftypes[2] = 'text'; fnames[4] = 'MMERGE4'; ftypes[4] = 'address'; fnames[6] = 'MMERGE6'; ftypes[6] = 'number'; fnames[9] = 'MMERGE9'; ftypes[9] = 'text'; fnames[5] = 'MMERGE5'; ftypes[5] = 'text'; fnames[7] = 'MMERGE7'; ftypes[7] = 'text'; fnames[8] = 'MMERGE8'; ftypes[8] = 'text'; fnames[10] = 'MMERGE10'; ftypes[10] = 'text'; fnames[11] = 'MMERGE11'; ftypes[11] = 'text'; fnames[12] = 'MMERGE12'; ftypes[12] = 'text'; var err_style = ''; try { err_style = mc_custom_error_style; } catch (e) { err_style = 'margin: 1em 0 0 0; padding: 1em 0.5em 0.5em 0.5em; background: rgb(255, 238, 238) none repeat scroll 0% 0%; font-weight: bold; float: left; z-index: 1; width: 80%; -moz-background-clip: -moz-initial; -moz-background-origin: -moz-initial; -moz-background-inline-policy: -moz-initial; color: rgb(255, 0, 0);'; } var mce_jQuery = jQuery.noConflict(); mce_jQuery(document).ready(function ($) { var options = { errorClass: 'mce_inline_error', errorElement: 'div', errorStyle: err_style, onkeyup: function () {}, onfocusout: function () {}, onblur: function () {} }; var mce_validator = mce_jQuery("#mc-embedded-subscribe-form").validate(options); options = { url: 'http://theatricalbellydance.us1.list-manage.com/subscribe/post-json?u=1d127e7630ced825cb1a8b5a9&id=9f12d2a6bb&c=?', type: 'GET', dataType: 'json', contentType: "application/json; charset=utf-8", beforeSubmit: function () { mce_jQuery('#mce_tmp_error_msg').remove(); mce_jQuery('.datefield', '#mc_embed_signup').each(function () { var txt = 'filled'; var fields = new Array(); var i = 0; mce_jQuery(':text', this).each(function () { fields[i] = this; i++; }); mce_jQuery(':hidden', this).each(function () { if (fields[0].value == 'MM' && fields[1].value == 'DD' && fields[2].value == 'YYYY') { this.value = ''; } else if (fields[0].value == '' && fields[1].value == '' && fields[2].value == '') { this.value = ''; } else { this.value = fields[0].value + '/' + fields[1].value + '/' + fields[2].value; } }); }); return mce_validator.form(); }, success: mce_success_cb }; mce_jQuery('#mc-embedded-subscribe-form').ajaxForm(options); }); function mce_success_cb(resp) { mce_jQuery('#mce-success-response').hide(); mce_jQuery('#mce-error-response').hide(); if (resp.result == "success") { mce_jQuery('#mce-' + resp.result + '-response').show(); mce_jQuery('#mce-' + resp.result + '-response').html(resp.msg); mce_jQuery('#mc-embedded-subscribe-form').each(function () { this.reset(); }); } else { var index = -1; var msg; try { var parts = resp.msg.split(' - ', 2); if (parts[1] == undefined) { msg = resp.msg; } else { i = parseInt(parts[0]); if (i.toString() == parts[0]) { index = parts[0]; msg = parts[1]; } else { index = -1; msg = resp.msg; } } } catch (e) { index = -1; msg = resp.msg; } try { if (index == -1) { mce_jQuery('#mce-' + resp.result + '-response').show(); mce_jQuery('#mce-' + resp.result + '-response').html(msg); } else { err_id = 'mce_tmp_error_msg'; html = '<div id="' + err_id + '" style="' + err_style + '"> ' + msg + '</div>'; var input_id = '#mc_embed_signup'; var f = mce_jQuery(input_id); if (ftypes[index] == 'address') { input_id = '#mce-' + fnames[index] + '-addr1'; f = mce_jQuery(input_id).parent().parent().get(0); } else if (ftypes[index] == 'date') { input_id = '#mce-' + fnames[index] + '-month'; f = mce_jQuery(input_id).parent().parent().get(0); } else { input_id = '#mce-' + fnames[index]; f = mce_jQuery().parent(input_id).get(0); } if (f) { mce_jQuery(f).append(html); mce_jQuery(input_id).focus(); } else { mce_jQuery('#mce-' + resp.result + '-response').show(); mce_jQuery('#mce-' + resp.result + '-response').html(msg); } } } catch (e) { mce_jQuery('#mce-' + resp.result + '-response').show(); mce_jQuery('#mce-' + resp.result + '-response').html(msg); } } } The hslides script: /* * hSlides (1.0) // 2008.02.25 // <http://plugins.jquery.com/project/hslides> * * REQUIRES jQuery 1.2.3+ <http://jquery.com/> * * Copyright (c) 2008 TrafficBroker <http://www.trafficbroker.co.uk> * Licensed under GPL and MIT licenses * * hSlides is an horizontal accordion navigation, sliding the panels around to reveal one of interest. * * Sample Configuration: * // this is the minimum configuration needed * $('#accordion').hSlides({ * totalWidth: 730, * totalHeight: 140, * minPanelWidth: 87, * maxPanelWidth: 425 * }); * * Config Options: * // Required configuration * totalWidth: Total width of the accordion // default: 0 * totalHeight: Total height of the accordion // default: 0 * minPanelWidth: Minimum width of the panel (closed) // default: 0 * maxPanelWidth: Maximum width of the panel (opened) // default: 0 * // Optional configuration * midPanelWidth: Middle width of the panel (centered) // default: 0 * speed: Speed for the animation // default: 500 * easing: Easing effect for the animation. Other than 'swing' or 'linear' must be provided by plugin // default: 'swing' * sensitivity: Sensitivity threshold (must be 1 or higher) // default: 3 * interval: Milliseconds for onMouseOver polling interval // default: 100 * timeout: Milliseconds delay before onMouseOut // default: 300 * eventHandler: Event to open panels: click or hover. For the hover option requires hoverIntent plugin <http://cherne.net/brian/resources/jquery.hoverIntent.html> // default: 'click' * panelSelector: HTML element storing the panels // default: 'li' * activeClass: CSS class for the active panel // default: none * panelPositioning: Accordion panelPositioning: top -> first panel on the bottom and next on the top, other value -> first panel on the top and next to the bottom // default: 'top' * // Callback funtctions. Inside them, we can refer the panel with $(this). * onEnter: Funtion raised when the panel is activated. // default: none * onLeave: Funtion raised when the panel is deactivated. // default: none * * We can override the defaults with: * $.fn.hSlides.defaults.easing = 'easeOutCubic'; * * @param settings An object with configuration options * @author Jesus Carrera <[email protected]> */ (function($) { $.fn.hSlides = function(settings) { // override default configuration settings = $.extend({}, $.fn.hSlides.defaults, settings); // for each accordion return this.each(function(){ var wrapper = this; var panelLeft = 0; var panels = $(settings.panelSelector, wrapper); var panelPositioning = 1; if (settings.panelPositioning != 'top'){ panelLeft = ($(settings.panelSelector, wrapper).length - 1) * settings.minPanelWidth; panels = $(settings.panelSelector, wrapper).reverse(); panelPositioning = -1; } // necessary styles for the wrapper $(this).css('position', 'relative').css('overflow', 'hidden').css('width', settings.totalWidth).css('height', settings.totalHeight); // set the initial position of the panels var zIndex = 0; panels.each(function(){ // necessary styles for the panels $(this).css('position', 'absolute').css('left', panelLeft).css('zIndex', zIndex).css('height', settings.totalHeight).css('width', settings.maxPanelWidth); zIndex ++; // if this panel is the activated by default, set it as active and move the next (to show this one) if ($(this).hasClass(settings.activeClass)){ $.data($(this)[0], 'active', true); if (settings.panelPositioning != 'top'){ panelLeft = ($(settings.panelSelector, wrapper).index(this) + 1) * settings.minPanelWidth - settings.maxPanelWidth; }else{ panelLeft = panelLeft + settings.maxPanelWidth; } }else{ // check if we are centering and some panel is active // this is why we can't add/remove the active class in the callbacks: positioning the panels if we have one active if (settings.midPanelWidth && $(settings.panelSelector, wrapper).hasClass(settings.activeClass) == false){ panelLeft = panelLeft + settings.midPanelWidth * panelPositioning; }else{ panelLeft = panelLeft + settings.minPanelWidth * panelPositioning; } } }); // iterates through the panels setting the active and changing the position var movePanels = function(){ // index of the new active panel var activeIndex = $(settings.panelSelector, wrapper).index(this); // iterate all panels panels.each(function(){ // deactivate if is the active if ( $.data($(this)[0], 'active') == true ){ $.data($(this)[0], 'active', false); $(this).removeClass(settings.activeClass).each(settings.onLeave); } // set position of current panel var currentIndex = $(settings.panelSelector, wrapper).index(this); panelLeft = settings.minPanelWidth * currentIndex; // if the panel is next to the active, we need to add the opened width if ( (currentIndex * panelPositioning) > (activeIndex * panelPositioning)){ panelLeft = panelLeft + (settings.maxPanelWidth - settings.minPanelWidth) * panelPositioning; } // animate $(this).animate({left: panelLeft}, settings.speed, settings.easing); }); // activate the new active panel $.data($(this)[0], 'active', true); $(this).addClass(settings.activeClass).each(settings.onEnter); }; // center the panels if configured var centerPanels = function(){ var panelLeft = 0; if (settings.panelPositioning != 'top'){ panelLeft = ($(settings.panelSelector, wrapper).length - 1) * settings.minPanelWidth; } panels.each(function(){ $(this).removeClass(settings.activeClass).animate({left: panelLeft}, settings.speed, settings.easing); if ($.data($(this)[0], 'active') == true){ $.data($(this)[0], 'active', false); $(this).each(settings.onLeave); } panelLeft = panelLeft + settings.midPanelWidth * panelPositioning ; }); }; // event handling if(settings.eventHandler == 'click'){ $(settings.panelSelector, wrapper).click(movePanels); }else{ var configHoverPanel = { sensitivity: settings.sensitivity, interval: settings.interval, over: movePanels, timeout: settings.timeout, out: function() {} } var configHoverWrapper = { sensitivity: settings.sensitivity, interval: settings.interval, over: function() {}, timeout: settings.timeout, out: centerPanels } $(settings.panelSelector, wrapper).hoverIntent(configHoverPanel); if (settings.midPanelWidth != 0){ $(wrapper).hoverIntent(configHoverWrapper); } } }); }; // invert the order of the jQuery elements $.fn.reverse = function(){ return this.pushStack(this.get().reverse(), arguments); }; // default settings $.fn.hSlides.defaults = { totalWidth: 0, totalHeight: 0, minPanelWidth: 0, maxPanelWidth: 0, midPanelWidth: 0, speed: 500, easing: 'swing', sensitivity: 3, interval: 100, timeout: 300, eventHandler: 'click', panelSelector: 'li', activeClass: false, panelPositioning: 'top', onEnter: function() {}, onLeave: function() {} }; })(jQuery);

Read the article

RUN FUNCTION AFTER SOMETIME IN JQUERY & AUTOMATIC SLICING OF IMAGES

- by user2697032

I am not being able to start the automatic slicing of images, it is happening only after a click, how should i modify my code so that i get to change the slicing of the images automatically. <!DOCTYPE html> <html lang="en"> <head> <title>Slicebox - 3D Image Slider</title> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="description" content="Slicebox - 3D Image Slider with Fallback" /> <meta name="keywords" content="jquery, css3, 3d, webkit, fallback, slider, css3, 3d transforms, slices, rotate, box, automatic" /> <meta name="author" content="Pedro Botelho for Codrops" /> <link rel="shortcut icon" href="../favicon.ico"> <link rel="stylesheet" type="text/css" href="css/demo.css" /> <link rel="stylesheet" type="text/css" href="css/slicebox.css" /> <link rel="stylesheet" type="text/css" href="css/custom.css" /> <script type="text/javascript" src="js/modernizr.custom.46884.js"></script> </head> <body onload="funct()"> <div class="container"> <div class="codrops-top clearfix"> <a href="http://tympanus.net/Development/AutomaticImageMontage/"><span>« Previous Demo: </span>Automatic Image Montage</a> <span class="right"> <a target="_blank" href="http://www.flickr.com/photos/strupler/">Images by <strong>ND Strupler</strong></a> <a href="http://tympanus.net/codrops/?p=5657"><strong>Back to the Codrops Article</strong></a> </span> </div> <h1>Slicebox <span>A fresh 3D image slider with graceful fallback</span></h1> <div class="more"> <ul id="sb-examples"> <li>More examples:</li> <li class="selected"><a href="index.html">Example 1</a></li> <li><a href="index2.html">Example 2</a></li> <li><a href="index3.html">Example 3</a></li> <li><a href="index4.html">Example 4</a></li> </ul> </div> <div class="wrapper" id="checkthis"> <ul id="sb-slider" class="sb-slider"> <li> <a href="http://www.flickr.com/photos/strupler/2969141180" target="_blank"><img src="images/1.jpg" alt="image1"/></a> <div class="sb-description"> <h3>Creative Lifesaver</h3> </div> </li> <li> <a href="http://www.flickr.com/photos/strupler/2968268187" target="_blank"><img src="images/2.jpg" alt="image2"/></a> <div class="sb-description"> <h3>Honest Entertainer</h3> </div> </li> <li> <a href="http://www.flickr.com/photos/strupler/2968114825" target="_blank"><img src="images/3.jpg" alt="image1"/></a> <div class="sb-description"> <h3>Brave Astronaut</h3> </div> </li> <li> <a href="http://www.flickr.com/photos/strupler/2968122059" target="_blank"><img src="images/4.jpg" alt="image1"/></a> <div class="sb-description"> <h3>Affectionate Decision Maker</h3> </div> </li> <li> <a href="http://www.flickr.com/photos/strupler/2969119944" target="_blank"><img src="images/5.jpg" alt="image1"/></a> <div class="sb-description"> <h3>Faithful Investor</h3> </div> </li> <li> <a href="http://www.flickr.com/photos/strupler/2968126177" target="_blank"><img src="images/6.jpg" alt="image1"/></a> <div class="sb-description"> <h3>Groundbreaking Artist</h3> </div> </li> <li> <a href="http://www.flickr.com/photos/strupler/2968945158" target="_blank"><img src="images/7.jpg" alt="image1"/></a> <div class="sb-description"> <h3>Selfless Philantropist</h3> </div> </li> </ul> <div id="shadow" class="shadow"></div> <div id="nav-arrows" class="nav-arrows"> <a href="#x">Next</a> <a href="#y">Previous</a> </div> <div id="nav-dots" class="nav-dots"> <span class="nav-dot-current"></span> <span></span> <span></span> <span></span> <span></span> <span></span> <span></span> </div> </div> <p class="info"><strong>Example 1:</strong> Default settings</p> </div> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> <script type="text/javascript" src="js/jquery.slicebox.js"></script> <script type="text/javascript"> $(function() { var Page = (function() { var $navArrows = $( '#nav-arrows' ).hide(), $navDots = $( '#nav-dots' ).hide(), $nav = $navDots.children( 'span' ), $shadow = $( '#shadow' ).hide(), slicebox = $( '#sb-slider' ).slicebox( { onReady : function() { $navArrows.show(); $navDots.show(); $shadow.show(); }, onBeforeChange : function( pos ) { $nav.removeClass( 'nav-dot-current' ); $nav.eq( pos ).addClass( 'nav-dot-current' ); } } ), init = function() { initEvents(); }, initEvents = function() { // add navigation events $navArrows.children( ':first' ).on( 'click', function() { setInterval("callme()", 1000); return false; } ); //$(function(){ //callme(); //}); function callme(){ //$('#checkit').append("callme loaded<br />"); slicebox.next(); setInterval("callme()", 1000); } $navArrows.children( ':last' ).on( 'click', function() { slicebox.previous(); return false; } ); $nav.each( function( i ) { $( this ).on( 'click', function( event ) { var $dot = $( this ); if( !slicebox.isActive() ) { $nav.removeClass( 'nav-dot-current' ); $dot.addClass( 'nav-dot-current' ); } slicebox.jump( i + 1 ); return false; } ); } ); }; return { init : init }; })(); Page.init(); }); </script> <script> // make sure the "myContainer" id in the script is the same id of the div $(document).ready(function() { slicebox.next(); $('#nav-arrows').sbslider(); // this is the piece of code that will do the magic thing }); </script> </body> </html> I am not being able to start the automatic slicing of images, it is happening only after a click, how should i modify my code so that i get to change the slicing of the images automatically.

Read the article

Android map performance with > 800 overlays of KML data

- by span

I have some a shape file which I have converted to a KML file that I wish to read coordinates from and then draw paths between the coordinates on a MapView. With the help of this great post: How to draw a path on a map using kml file? I have been able to read the the KML into an ArrayList of "Placemarks". This great blog post then showed how to take a list of GeoPoints and draw a path: http://djsolid.net/blog/android---draw-a-path-array-of-points-in-mapview The example in the above post only draws one path between some points however and since I have many more paths than that I am running into some performance problems. I'm currently adding a new RouteOverlay for each of the separate paths. This results in me having over 800 overlays when they have all been added. This has a performance hit and I would love some input on what I can do to improve it. Here are some options I have considered: Try to add all the points to a List which then can be passed into a class that will extend Overlay. In that new class perhaps it would be possible to add and draw the paths in a single Overlay layer? I'm not sure on how to implement this though since the paths are not always intersecting and they have different start and end points. At the moment I'm adding each path which has several points to it's own list and then I add that to an Overlay. That results in over 700 overlays... Simplify the KML or SHP. Instead of having over 700 different paths, perhaps there is someway to merge them into perhaps 100 paths or less? Since alot of paths are intersected at some point it should be possible to modify the original SHP file so that it merges all intersections. Since I have never worked with these kinds of files before I have not been able to find a way to do this in GQIS. If someone knows how to do this I would love for some input on that. Here is a link to the group of shape files if you are interested: http://danielkvist.net/cprg_bef_cbana_polyline.shp http://danielkvist.net/cprg_bef_cbana_polyline.shx http://danielkvist.net/cprg_bef_cbana_polyline.dbf http://danielkvist.net/cprg_bef_cbana_polyline.prj Anyway, here is the code I'm using to add the Overlays. Many thanks in advance. RoutePathOverlay.java package net.danielkvist; import java.util.List; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.Paint; import android.graphics.Path; import android.graphics.Point; import android.graphics.RectF; import com.google.android.maps.GeoPoint; import com.google.android.maps.MapView; import com.google.android.maps.Overlay; import com.google.android.maps.Projection; public class RoutePathOverlay extends Overlay { private int _pathColor; private final List<GeoPoint> _points; private boolean _drawStartEnd; public RoutePathOverlay(List<GeoPoint> points) { this(points, Color.RED, false); } public RoutePathOverlay(List<GeoPoint> points, int pathColor, boolean drawStartEnd) { _points = points; _pathColor = pathColor; _drawStartEnd = drawStartEnd; } private void drawOval(Canvas canvas, Paint paint, Point point) { Paint ovalPaint = new Paint(paint); ovalPaint.setStyle(Paint.Style.FILL_AND_STROKE); ovalPaint.setStrokeWidth(2); int _radius = 6; RectF oval = new RectF(point.x - _radius, point.y - _radius, point.x + _radius, point.y + _radius); canvas.drawOval(oval, ovalPaint); } public boolean draw(Canvas canvas, MapView mapView, boolean shadow, long when) { Projection projection = mapView.getProjection(); if (shadow == false && _points != null) { Point startPoint = null, endPoint = null; Path path = new Path(); // We are creating the path for (int i = 0; i < _points.size(); i++) { GeoPoint gPointA = _points.get(i); Point pointA = new Point(); projection.toPixels(gPointA, pointA); if (i == 0) { // This is the start point startPoint = pointA; path.moveTo(pointA.x, pointA.y); } else { if (i == _points.size() - 1)// This is the end point endPoint = pointA; path.lineTo(pointA.x, pointA.y); } } Paint paint = new Paint(); paint.setAntiAlias(true); paint.setColor(_pathColor); paint.setStyle(Paint.Style.STROKE); paint.setStrokeWidth(3); paint.setAlpha(90); if (getDrawStartEnd()) { if (startPoint != null) { drawOval(canvas, paint, startPoint); } if (endPoint != null) { drawOval(canvas, paint, endPoint); } } if (!path.isEmpty()) canvas.drawPath(path, paint); } return super.draw(canvas, mapView, shadow, when); } public boolean getDrawStartEnd() { return _drawStartEnd; } public void setDrawStartEnd(boolean markStartEnd) { _drawStartEnd = markStartEnd; } } MyMapActivity package net.danielkvist; import java.util.ArrayList; import java.util.Collection; import java.util.Iterator; import android.graphics.Color; import android.os.Bundle; import android.util.Log; import com.google.android.maps.GeoPoint; import com.google.android.maps.MapActivity; import com.google.android.maps.MapView; public class MyMapActivity extends MapActivity { /** Called when the activity is first created. */ @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); MapView mapView = (MapView) findViewById(R.id.mapview); mapView.setBuiltInZoomControls(true); String url = "http://danielkvist.net/cprg_bef_cbana_polyline_simp1600.kml"; NavigationDataSet set = MapService.getNavigationDataSet(url); drawPath(set, Color.parseColor("#6C8715"), mapView); } /** * Does the actual drawing of the route, based on the geo points provided in * the nav set * * @param navSet * Navigation set bean that holds the route information, incl. * geo pos * @param color * Color in which to draw the lines * @param mMapView01 * Map view to draw onto */ public void drawPath(NavigationDataSet navSet, int color, MapView mMapView01) { ArrayList<GeoPoint> geoPoints = new ArrayList<GeoPoint>(); Collection overlaysToAddAgain = new ArrayList(); for (Iterator iter = mMapView01.getOverlays().iterator(); iter.hasNext();) { Object o = iter.next(); Log.d(BikeApp.APP, "overlay type: " + o.getClass().getName()); if (!RouteOverlay.class.getName().equals(o.getClass().getName())) { overlaysToAddAgain.add(o); } } mMapView01.getOverlays().clear(); mMapView01.getOverlays().addAll(overlaysToAddAgain); int totalNumberOfOverlaysAdded = 0; for(Placemark placemark : navSet.getPlacemarks()) { String path = placemark.getCoordinates(); if (path != null && path.trim().length() > 0) { String[] pairs = path.trim().split(" "); String[] lngLat = pairs[0].split(","); // lngLat[0]=longitude // lngLat[1]=latitude // lngLat[2]=height try { if(lngLat.length > 1 && !lngLat[0].equals("") && !lngLat[1].equals("")) { GeoPoint startGP = new GeoPoint( (int) (Double.parseDouble(lngLat[1]) * 1E6), (int) (Double.parseDouble(lngLat[0]) * 1E6)); GeoPoint gp1; GeoPoint gp2 = startGP; geoPoints = new ArrayList<GeoPoint>(); geoPoints.add(startGP); for (int i = 1; i < pairs.length; i++) { lngLat = pairs[i].split(","); gp1 = gp2; if (lngLat.length >= 2 && gp1.getLatitudeE6() > 0 && gp1.getLongitudeE6() > 0 && gp2.getLatitudeE6() > 0 && gp2.getLongitudeE6() > 0) { // for GeoPoint, first:latitude, second:longitude gp2 = new GeoPoint( (int) (Double.parseDouble(lngLat[1]) * 1E6), (int) (Double.parseDouble(lngLat[0]) * 1E6)); if (gp2.getLatitudeE6() != 22200000) { geoPoints.add(gp2); } } } totalNumberOfOverlaysAdded++; mMapView01.getOverlays().add(new RoutePathOverlay(geoPoints)); } } catch (NumberFormatException e) { Log.e(BikeApp.APP, "Cannot draw route.", e); } } } Log.d(BikeApp.APP, "Total overlays: " + totalNumberOfOverlaysAdded); mMapView01.setEnabled(true); } @Override protected boolean isRouteDisplayed() { // TODO Auto-generated method stub return false; } } Edit: There are of course some more files I'm using but that I have not posted. You can download the complete Eclipse project here: http://danielkvist.net/se.zip

Read the article

Website displays in chrome perfectly, but not in mozilla or IE

- by Atharul Khan

here are the code snippets for the html and css. It works finds in Google chrome, but when I try to display it in mozilla or IE, it shows something completely different. I cannot attach images as I do not have the required reputation. I really appreciate the help. Thank you! HTML <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="Content-type" content="text/html; charset=utf-8" /> <meta name="viewport" content="width=device-width, initial-scale=1" /> <link rel="stylesheet" type="text/css" href="style.css"> <link rel="shortcut icon" href="ak.png"> <title>Home</title> </head> <body> <div class="Nav"> <nav> <ul class="navigation fade-in2"> <li><a href="#home">Home</a></li> <li><a href="#about">About</a></li> <li><a href="#portfolio">Portfolio</a></li> <li><a href="#shop">Shop</a></li> <li><a href="#blog">Blog</a></li> <li><a href="#contact">Contact</a></li> </ul> </nav> </div> <div class="logo"><a href="#home"><img class="ak fade-in2" src="ak.png"></a></div> <div class="background"><img class="beauty" src="beauty.jpg"></div> <div class="header"> <h1 class="headerName fade-in">DESIGN | DEVELOP | BRAND</h1> <h4 class="service fade-in3"><a href="#portfolio">VIEW PORTFOLIO</a></h4> <h4 class="service fade-in3"><a href="#services">VIEW SERVICES</a></h4> </div>  </body> </html> CSS @-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } } @-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } } @keyframes fadeIn { from { opacity:0; } to { opacity:1; } } * { padding: 0; margin: 0; } li { display: inline; font-size: 15px; font-family: verdana; } nav { width: 100%; text-align: right; background-color: #222222; padding: 0; margin: 0px; line-height: 47px; position: fixed; z-index: 100; } .ak{ width: 90px; height: 55px; z-index: 101; position: fixed; background: transparent; color: transparent; background-color: transparent; } .Nav a{ text-decoration: none; padding: 15px; } .Nav a:link{ color: #A7A7A7; } .Nav a:visited{ color: #A7A7A7; } .Nav a:hover{ color: #DBDBDB; transition: all 0.3s ease-out 0s; transition-property: all; transition-duration: 0.3s; transition-timing-function: ease-out; transition-delay: 0s; } .header { background-color: rgba(0,0,0, 0.25); width: 100%; height: 626px; text-align: center; position: fixed; z-index: 10; } .background { position: fixed; z-index: 8; } .beauty { width: 100%; height: 626px; } .headerName { font-size: 2.5em; text-align: center; color: #D3D3D3; padding: 180px; padding-bottom: 50px; margin: 0px; letter-spacing: 4px; font-weight: 100; font-family: 'Lato', sans-serif; } .fade-in { opacity:0; /* make things invisible upon start */ -webkit-animation:fadeIn ease-in 1; /* call our keyframe named fadeIn, use animation ease-in and repeat it only 1 time */ -moz-animation:fadeIn ease-in 1; animation:fadeIn ease-in 1; -webkit-animation-fill-mode:forwards; /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/ -moz-animation-fill-mode:forwards; animation-fill-mode:forwards; -webkit-animation-duration:1s; -moz-animation-duration:1s; animation-duration:1s; -webkit-animation-delay: 0.3s; -moz-animation-delay:0.3s; animation-delay: 0.3s; } .fade-in2 { opacity:0; /* make things invisible upon start */ -webkit-animation:fadeIn ease-in 1; /* call our keyframe named fadeIn, use animation ease-in and repeat it only 1 time */ -moz-animation:fadeIn ease-in 1; animation:fadeIn ease-in 1; -webkit-animation-fill-mode:forwards; /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/ -moz-animation-fill-mode:forwards; animation-fill-mode:forwards; -webkit-animation-duration:1s; -moz-animation-duration:1s; animation-duration:1s; -webkit-animation-delay: 0.6s; -moz-animation-delay:0.6s; animation-delay: 0.6s; } .fade-in3 { opacity:0; /* make things invisible upon start */ -webkit-animation:fadeIn ease-in 1; /* call our keyframe named fadeIn, use animation ease-in and repeat it only 1 time */ -moz-animation:fadeIn ease-in 1; animation:fadeIn ease-in 1; -webkit-animation-fill-mode:forwards; /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/ -moz-animation-fill-mode:forwards; animation-fill-mode:forwards; -webkit-animation-duration:1s; -moz-animation-duration:1s; animation-duration:1s; -webkit-animation-delay: 0.9s; -moz-animation-delay:0.9s; animation-delay: 0.9s; } .service{ font-size: 14px; width: 190px; text-align: center; font-family: 'Lato', sans-serif; color: #D3D3D3; border: 2px #A7A7A7 solid; border-color: rgba(255, 255, 255, 0.5); display: inline-block; border-radius: 5px; background-color: transparent; letter-spacing: 2px; } .service a{ text-decoration: none; display: block; padding: 15px 20px; } .service a:link{ color: #D3D3D3; } .service a:visited{ color: #D3D3D3; } .service a:hover{ background-color: rgba(255, 255, 255, 0.15); transition: background-color .15s ease-in; -webkit-transition: background-color .15s ease-in; -moz-transition: background-color .15s ease-in; -o-transition: background-color .15s ease-in; } UPDATE 1: I updated both browsers and it seems the css3 animations work perfectly fine on both browsers. What seems to be the problem is the positioning of the pages UPDATE 2: Here are the links to the different browser screen shots Chrome: https://www.dropbox.com/s/jlpa4vu51kdnews/Chrome.JPG InternetExplorer: https://www.dropbox.com/s/zbchs3su9ahxr0n/IE.JPG Mozilla Firefox: dropbox(.)com/s/fyalnhsha9ktadz/Mozilla.JPG (I can't post the third link because I don't have enough reputation)

Read the article

Drupal views pane content not visible

- by jwandborg

I have a pane on my front page with one content pane and two views panes. I can't see the content of the third view ($pane->pid = "new-3" / comment: # Senaste bilder). Here's my panel <?php $page = new stdClass; $page->disabled = FALSE; /* Edit this to true to make a default page disabled initially */ $page->api_version = 1; $page->name = 'frontpage'; $page->task = 'page'; $page->admin_title = 'Startsida'; $page->admin_description = ''; $page->path = 'hem'; $page->access = array(); $page->menu = array(); $page->arguments = array(); $page->conf = array(); $page->default_handlers = array(); $handler = new stdClass; $handler->disabled = FALSE; /* Edit this to true to make a default handler disabled initially */ $handler->api_version = 1; $handler->name = 'page_frontpage_panel_context'; $handler->task = 'page'; $handler->subtask = 'frontpage'; $handler->handler = 'panel_context'; $handler->weight = 0; $handler->conf = array( 'title' => 'Panel', 'no_blocks' => FALSE, 'css_id' => '', 'css' => '', 'contexts' => array(), 'relationships' => array(), ); $display = new panels_display; $display->layout = 'onecol'; $display->layout_settings = array(); $display->panel_settings = array(); $display->cache = array(); $display->title = ''; $display->content = array(); $display->panels = array(); # Bild $pane = new stdClass; $pane->pid = 'new-1'; $pane->panel = 'middle'; $pane->type = 'custom'; $pane->subtype = 'custom'; $pane->shown = TRUE; $pane->access = array(); $pane->configuration = array( 'admin_title' => '', 'title' => '', 'body' => '<img src="/sites/all/themes/zen/ils-2010/img/graphics-start-text-v3.png" alt="Hej! Vi vet att du och dina klasskompisar har mycket att tänka på under er sista termin i gymnasiet. Därför har vi samlat några saker som vi tror kommer göra er studenttid lite roligare och lite enklare. Välkommen!" />', 'format' => '2', 'substitute' => TRUE, ); $pane->cache = array(); $pane->style = array(); $pane->css = array(); $pane->extras = array(); $pane->position = 0; $display->content['new-1'] = $pane; $display->panels['middle'][0] = 'new-1'; # Topplista $pane = new stdClass; $pane->pid = 'new-2'; $pane->panel = 'middle'; $pane->type = 'views_panes'; $pane->subtype = 'topplista_terms-panel_pane_1'; $pane->shown = TRUE; $pane->access = array(); $pane->configuration = array( 'link_to_view' => 1, 'more_link' => 0, 'use_pager' => 0, 'pager_id' => '', 'items_per_page' => '10', 'offset' => '0', 'path' => 'flaktavling/topplista/klasser', 'override_title' => 0, 'override_title_text' => '', ); $pane->cache = array(); $pane->style = array(); $pane->css = array(); $pane->extras = array(); $pane->position = 1; $display->content['new-2'] = $pane; $display->panels['middle'][1] = 'new-2'; # Senaste bilder $pane = new stdClass; $pane->pid = 'new-3'; $pane->panel = 'middle'; $pane->type = 'views_panes'; $pane->subtype = 'senaste_bilderna-panel_pane_1'; $pane->shown = TRUE; $pane->access = array(); $pane->configuration = array( 'link_to_view' => 0, 'more_link' => 0, 'use_pager' => 0, 'pager_id' => '', 'items_per_page' => '2', 'offset' => '0', 'path' => 'galleri/senaste-bilder', 'override_title' => 0, 'override_title_text' => '', ); $pane->cache = array(); $pane->style = array(); $pane->css = array( 'css_id' => 'pane-senaste-bilderna', 'css_class' => '', ); $pane->extras = array(); $pane->position = 2; $display->content['new-3'] = $pane; $display->panels['middle'][2] = 'new-3'; $display->hide_title = PANELS_TITLE_FIXED; $display->title_pane = 'new-1'; $handler->conf['display'] = $display; $page->default_handlers[$handler->name] = $handler; Here´s the view senaste_bilderna <?php $view = new view; $view->name = 'senaste_bilderna'; $view->description = ''; $view->tag = ''; $view->view_php = ''; $view->base_table = 'node'; $view->is_cacheable = FALSE; $view->api_version = 2; $view->disabled = FALSE; /* Edit this to true to make a default view disabled initially */ $handler = $view->new_display('default', 'Förvalt', 'default'); $handler->override_option('fields', array( 'field_picture_fid' => array( 'id' => 'field_picture_fid', 'table' => 'node_data_field_picture', 'field' => 'field_picture_fid', ), )); $handler->override_option('sorts', array( 'created' => array( 'order' => 'DESC', 'granularity' => 'second', 'id' => 'created', 'table' => 'node', 'field' => 'created', 'relationship' => 'none', ), )); $handler->override_option('filters', array( 'type' => array( 'operator' => 'in', 'value' => array( 'ils_picture' => 'ils_picture', ), 'group' => '0', 'exposed' => FALSE, 'expose' => array( 'operator' => FALSE, 'label' => '', ), 'id' => 'type', 'table' => 'node', 'field' => 'type', 'override' => array( 'button' => 'Åsidosätt', ), 'relationship' => 'none', ), )); $handler->override_option('access', array( 'type' => 'none', )); $handler->override_option('cache', array( 'type' => 'none', )); $handler->override_option('title', 'Senaste bilderna från galleriet'); $handler->override_option('items_per_page', 2); $handler->override_option('row_options', array( 'inline' => array( 'field_picture_fid' => 'field_picture_fid', ), 'separator' => '', 'hide_empty' => 0, )); $handler = $view->new_display('panel_pane', 'Content pane', 'panel_pane_1'); $handler->override_option('pane_title', ''); $handler->override_option('pane_description', ''); $handler->override_option('pane_category', array( 'name' => 'View panes', 'weight' => 0, )); $handler->override_option('allow', array( 'use_pager' => FALSE, 'items_per_page' => FALSE, 'offset' => FALSE, 'link_to_view' => FALSE, 'more_link' => FALSE, 'path_override' => FALSE, 'title_override' => FALSE, 'exposed_form' => FALSE, )); $handler->override_option('argument_input', array()); $handler->override_option('link_to_view', 0); $handler->override_option('inherit_panels_path', 0); $handler = $view->new_display('page', 'Sida', 'page_1'); $handler->override_option('path', 'galleri/senaste-bilderna'); $handler->override_option('menu', array( 'type' => 'none', 'title' => '', 'description' => '', 'weight' => 0, 'name' => 'navigation', )); $handler->override_option('tab_options', array( 'type' => 'none', 'title' => '', 'description' => '', 'weight' => 0, )); I have edited one views template, here's the code in the file views-view-fields--senaste-bilderna.tpl.php <?php // $Id: views-view-fields.tpl.php,v 1.6 2008/09/24 22:48:21 merlinofchaos Exp $ /** * @file views-view-fields.tpl.php * Default simple view template to all the fields as a row. * * - $view: The view in use. * - $fields: an array of $field objects. Each one contains: * - $field->content: The output of the field. * - $field->raw: The raw data for the field, if it exists. This is NOT output safe. * - $field->class: The safe class id to use. * - $field->handler: The Views field handler object controlling this field. Do not use * var_export to dump this object, as it can't handle the recursion. * - $field->inline: Whether or not the field should be inline. * - $field->inline_html: either div or span based on the above flag. * - $field->separator: an optional separator that may appear before a field. * - $row: The raw result object from the query, with all data it fetched. * * @ingroup views_templates */ ?> <?php foreach ($fields as $id => $field): ?> <?php $result = db_query('SELECT * FROM {files} WHERE fid = ' . $row->node_data_field_picture_field_picture_fid ); ?> <?php $data = db_fetch_object( $result ); ?> <div id="senaste-bilderna-first"><img src="<?= imagecache_create_url('senaste_bilderna_thumbnail', $data->filepath) ?>" alt="" /></div> <?php /* if (!empty($field->separator)): <?php print $field->separator; <?php endif; <<?php print $field->inline_html; class="views-field-<?php print $field->class; "> <?php if ($field->label): <label class="views-label-<?php print $field->class; "> <?php print $field->label; : </label> <?php endif; <?php // $field->element_type is either SPAN or DIV depending upon whether or not // the field is a 'block' element type or 'inline' element type. <<?php print $field->element_type; class="field-content"><?php print $field->content; </<?php print $field->element_type; > </<?php print $field->inline_html;> <?php*/ endforeach; ?> This is the result <div class="panel-separator"> </div> <div class="panel-pane pane-views-panes pane-senaste-bilderna-panel-pane-1" id="pane-senaste-bilderna"> <h2 class="pane-title">Senaste bilderna från galleriet </h2> <div class="pane-content"> <div class="view view-senaste-bilderna view-id-senaste_bilderna view-display-id-panel_pane_1 view-dom-id-2"> <div class="view-content"> <div class="views-row views-row-1 views-row-odd views-row-first"> </div> <div class="views-row views-row-2 views-row-even views-row-last"> </div> </div> </div> </div> </div> My Drupal version is 6.16

Read the article

IIRF reverse proxy problem

- by Sergei

Hi everyone, We have a java application ( Atlassian Bamboo) running on port 8085 on Windows 2003. It is accessile as http: //bamboo:8085. I am trying to setup reverse proxy for IIS6 using IIRF so content is accessible via http: //bamboo. It seems that I set it ip correctly, and I can retrieve Status page. This is how my IIRF.ini looks like: RewriteLog c:\temp\iirf RewriteLogLevel 2 StatusUrl /iirfStatus RewriteCond %{HTTP_HOST} ^bambooi$ [I] #This setup works #ProxyPass ^/(.*)$ http://othersite/$1 #This does not ProxyPass ^/(.*)$ http://bamboo:8085/$1 However when I type in http: //bamboo in IE, I get 'page cannot be displayed ' message. FF does not return anything at all. I made Wireshark network dump, selected 'follow TCPstream' and it seems like correct page is being retrieved.Why cannot I see it then? I also noticed that I can retrieve http: //bamboo/favicon.ico so I must be very close to the solution.. This is the Wireshark output: GET / HTTP/1.1 Accept: image/gif, image/jpeg, image/pjpeg, image/pjpeg, application/x-shockwave-flash, application/vnd.ms-excel, application/vnd.ms-powerpoint, application/msword, application/x-ms-application, application/x-ms-xbap, application/vnd.ms-xpsdocument, application/xaml+xml, */* Accept-Language: en-gb User-Agent: Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 5.1; Trident/4.0; .NET CLR 1.1.4322; .NET CLR 2.0.50727; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729) Accept-Encoding: gzip, deflate Host: bamboo Connection: Keep-Alive Cookie: JSESSIONID=wpsse0zyo4g5 HTTP/1.1 200 200 OK Date: Sat, 30 Jan 2010 09:19:46 GMT Server: Microsoft-IIS/6.0 Via: 1.1 DESTINATION_IP (IIRF 2.0) Content-Type: text/html; charset=utf-8 Transfer-Encoding: chunked <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>Dashboard</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> <meta name="robots" content="all" /> <meta name="MSSmartTagsPreventParsing" content="true" /> <meta http-equiv="Pragma" content="no-cache" /> <meta http-equiv="Expires" content="-1" /> <link type="text/css" rel="stylesheet" href="/s/1206/1/_/scripts/yui-2.6.0/build/grids/grids.css" />  <link rel="stylesheet" href="/s/1206/1/_/styles/main.css" type="text/css" /> <link rel="stylesheet" href="/s/1206/1/_/styles/main2.css" type="text/css" /> <link rel="stylesheet" href="/s/1206/1/_/styles/global-static.css" type="text/css" /> <link rel="stylesheet" href="/s/1206/1/_/styles/widePlanList.css" type="text/css" /> <link rel="stylesheet" href="/s/1206/1/_/styles/forms.css" type="text/css" /> <link rel="stylesheet" href="/s/1206/1/_/styles/yui-support/yui-custom.css" type="text/css" /> <link rel="shortcut icon" href="/s/1206/1/_/images/icons/favicon.ico" type="image/x-icon"/> <link rel="icon" href="/s/1206/1/_/images/icons/favicon.png" type="image/png" /> <link rel="stylesheet" href="/s/1206/1/_/styles/bamboo-tabs.css" type="text/css" />  <link rel="stylesheet" type="text/css" href="/s/1206/1/_/scripts/yui-2.6.0/build/tabview/assets/tabview-core.css"> <link rel="stylesheet" type="text/css" href="/s/1206/1/_/scripts/yui-2.6.0/build/tabview/assets/skins/sam/tabview-skin.css"> <script type="text/javascript" src="/s/1206/1/_/scripts/yui-2.6.0/build/yahoo/yahoo-min.js"></script> <script type="text/javascript" src="/s/1206/1/_/scripts/yui-2.6.0/build/event/event-min.js" ></script> <script type="text/javascript" src="/s/1206/1/_/scripts/yui-2.6.0/build/dom/dom-min.js" ></script>   <script type="text/javascript" src="/s/1206/1/_/scripts/yui-2.6.0/build/container/container-min.js"></script> <script type="text/javascript" src="/s/1206/1/_/scripts/yui-2.6.0/build/connection/connection-min.js"></script> <link type="text/css" rel="stylesheet" href="/s/1206/1/_/scripts/yui-2.6.0/build/container/assets/container.css" />  <script type="text/javascript" src="/s/1206/1/_/scripts/yui-2.6.0/build/menu/menu-min.js"></script> <link type="text/css" rel="stylesheet" href="/s/1206/1/_/scripts/yui-2.6.0/build/menu/assets/menu.css" />   <script type="text/javascript" src="/s/1206/1/_/scripts/yui-2.6.0/build/yahoo-dom-event/yahoo-dom-event.js"></script> <script type="text/javascript" src="/s/1206/1/_/scripts/yui-2.6.0/build/element/element-beta-min.js"></script>  <link rel="stylesheet" href="/s/1206/1/_/styles/yui-support/tabview.css" type="text/css" /> <link rel="stylesheet" href="/s/1206/1/_/styles/yui-support/round_tabs.css" type="text/css" /> <script type="text/javascript" src="/s/1206/1/_/scripts/yui-2.6.0/build/tabview/tabview-min.js"></script> <script type="text/javascript" src="/s/1206/1/_/scripts/yui-2.6.0/build/json/json-min.js"></script> <script type="text/javascript" src="/s/1206/1/_/scripts/yui-ext/yui-ext-nogrid.js"></script> <script type="text/javascript" src="/s/1206/1/_/scripts/bamboo.js"></script> <script type="text/javascript"> YAHOO.namespace('bamboo'); YAHOO.bamboo.tooltips = new Object(); YAHOO.bamboo.contextPath = ''; YAHOO.ext.UpdateManager.defaults.loadScripts = true; YAHOO.ext.UpdateManager.defaults.indicatorText = '<div class="loading-indicator">Currently loading...</div>'; YAHOO.ext.UpdateManager.defaults.timeout = 60; addUniversalOnload(addConfirmationToLinks); </script> <link rel="alternate" type="application/rss+xml" title="Bamboo RSS feed" href="/rss/createAllBuildsRssFeed.action?feedType=rssAll" /> </head> <body> <ul id="top"> <li id="skipNav"> <a href="#menu">Skip to navigation</a> </li> <li> <a href="#content">Skip to content</a> </li> </ul> <div id="nonFooter"> <div id="hd"> <div id="header"> <div id="logo"> <a href="/start.action"><img src="/images/bamboo_header_logo.gif" alt="Atlassian Bamboo" height="36" width="118" /></a> </div> <ul id="userOptions"> <li id="loginLink"> <a id="login" href="/userlogin!default.action?os_destination=%2Fstart.action">Log in</a> </li> <li id="signupLink"> <a id="signup" href="/signupUser!default.action">Signup</a> </li> <li id="helpLink"> <a id="help" href="http://confluence.atlassian.com/display/BAMBOO">Help</a> </li> </ul> </div>  <div id="menu"> <ul> <li><a id="home" href="/start.action" title="Atlassian Bamboo" accesskey="H"> <u>H</u>ome</a></li> <li><a id="authors" href="/authors/gotoAuthorReport.action" accesskey="U">A<u>u</u>thors</a></li> <li><a id="reports" href="/reports/viewReport.action" accesskey="R"> <u>R</u>eports</a></li> </ul> </div>  </div>  <div id="bd"> <div id="content"> <h1>Header here</h1> <div class="topMarginned"> <div id='buildSummaryTabs' class='dashboardTab'> </div> <script type="text/javascript"> function initUI(){ var jtabs = new YAHOO.ext.TabPanel('buildSummaryTabs'); YAHOO.bamboo.tabPanel = jtabs; // Use setUrl for Ajax loading var tab3 = jtabs.addTab('allTab', "All Plans"); tab3.setUrl('/ajax/displayAllBuildSummaries.action', null, true); var tab4 = jtabs.addTab("currentTab", "Current Activity"); tab4.setUrl('/ajax/displayCurrentActivity.action', null, true); var handleTabChange = function(e, activePanel) { saveCookie('atlassian.bamboo.dashboard.tab.selected', activePanel.id, 365); }; jtabs.on('tabchange', handleTabChange); var selectedCookie = getCookieValue('atlassian.bamboo.dashboard.tab.selected'); if (jtabs.getTab(selectedCookie)) { jtabs.activate(selectedCookie); } else { jtabs.activate('allTab'); } } YAHOO.util.Event.onContentReady('buildSummaryTabs', initUI); </script> </div> <script type="text/javascript"> setTimeout( "window.location.reload()", 1800*1000 ); </script> <div class="clearer" ></div> </div>  </div>  </div>  <div id="ft"> <div id="footer"> <p> Powered by <a href="http://www.atlassian.com/software/bamboo/">Atlassian Bamboo</a> version 2.2.1 build 1206 - <span title="15:59:44 17 Mar 2009">17 Mar 09</span> </p> <ul> <li class="first"> <a href="https://support.atlassian.com/secure/CreateIssue.jspa?pid=10060&issuetype=1">Report a problem</a> </li> <li> <a href="http://jira.atlassian.com/secure/CreateIssue.jspa?pid=11011&issuetype=4">Request a feature</a> </li> <li> <a href="http://forums.atlassian.com/forum.jspa?forumID=103">Contact Atlassian</a> </li> <li> <a href="/viewAdministrators.action">Contact Administrators</a> </li> </ul> </div>  </div>

Read the article

Error while validating HTML "document type does not allow element "li" here; missing one of "ul", "o

- by brumila

Hey! So I'm trying to code something on wordpress for the first time but the validator doesn't seem to like me. Look at the error I got while validating: Line 87, Column 33: document type does not allow element "li" here; missing one of "ul", "ol", "menu", "dir" start-tag I've searched everywhere, I'm not aware of any missing or misplaced li or ul tags can someone help me out on this one? <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head profile="http://gmpg.org/xfn/11"> <title> Blog</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta name="generator" content="WordPress 2.9.2" />  <link rel="stylesheet" href="http://localhost/wordpress/wp-content/themes/cmc-milagro/style.css" type="text/css" media="screen" /> <link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="http://localhost/wordpress/?feed=rss2" /> <link rel="alternate" type="text/xml" title="RSS .92" href="http://localhost/wordpress/?feed=rss" /> <link rel="alternate" type="application/atom+xml" title="Atom 0.3" href="http://localhost/wordpress/?feed=atom" /> <link rel="pingback" href="http://localhost/wordpress/xmlrpc.php" /> <link rel='archives' title='March 2010' href='http://localhost/wordpress/?m=201003' /> <link rel="EditURI" type="application/rsd+xml" title="RSD" href="http://localhost/wordpress/xmlrpc.php?rsd" /> <link rel="wlwmanifest" type="application/wlwmanifest+xml" href="http://localhost/wordpress/wp-includes/wlwmanifest.xml" /> <link rel='index' title='Blog' href='http://localhost/wordpress' /> <meta name="generator" content="WordPress 2.9.2" /> </head> <body> <div> <h1><a href="http://localhost/wordpress"> Blog</a> </h1> Just another WordPress weblog</div> <div id="container"> <h2><a href="http://localhost/wordpress/?p=8"> Teste Post 3 </a></h2> <div class="post" id="post-8"> <div class="entry"> <p>Aliquam erat volutpat. Fusce in nibh elit. Morbi lorem urna, viverra sed blandit eget, mattis venenatis felis. Maecenas viverra pellentesque justo, vel tincidunt massa semper sit amet. Vestibulum rhoncus purus in mauris fermentum ut aliquet augue semper.</p> <p class="postmetadata"> Filed under: <a href="http://localhost/wordpress/?cat=1" title="View all posts in Uncategorized" rel="category">Uncategorized</a> by admin <br /> <a href="http://localhost/wordpress/?p=8#respond" title="Comment on Teste Post 3">No Comments »</a> | <a class="post-edit-link" href="http://localhost/wordpress/wp-admin/post.php?action=edit&post=8" title="Edit post">Edit</a> </p> </div> </div> <h2><a href="http://localhost/wordpress/?p=5"> Teste Post 2 </a></h2> <div class="post" id="post-5"> <div class="entry"> <p>Aliquam erat volutpat. Fusce in nibh elit. Morbi lorem urna, viverra sed blandit eget, mattis venenatis felis. Maecenas viverra pellentesque justo, vel tincidunt massa semper sit amet. Vestibulum rhoncus purus in mauris fermentum ut aliquet augue semper. Duis orci metus, cursus ac tempor eget, faucibus vel elit. Sed rutrum mollis posuere. Maecenas luctus commodo augue vel fringilla. Nunc enim lacus, varius nec tempor sed, congue vel elit. Suspendisse urna ligula, pharetra ac malesuada quis, scelerisque eget justo.</p> <p class="postmetadata"> Filed under: <a href="http://localhost/wordpress/?cat=1" title="View all posts in Uncategorized" rel="category">Uncategorized</a> by admin <br /> <a href="http://localhost/wordpress/?p=5#respond" title="Comment on Teste Post 2">No Comments »</a> | <a class="post-edit-link" href="http://localhost/wordpress/wp-admin/post.php?action=edit&post=5" title="Edit post">Edit</a> </p> </div> </div> <h2><a href="http://localhost/wordpress/?p=3"> Teste Post 1 </a></h2> <div class="post" id="post-3"> <div class="entry"> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam ut mattis elit. In sed nulla lobortis dolor pellentesque fringilla at eget ipsum. Proin pellentesque vehicula ultricies. Phasellus velit nunc, tempus nec scelerisque vel, euismod pellentesque diam. Vivamus consectetur, sapien sit amet rhoncus porta, sapien nisl imperdiet diam, dapibus placerat sem ante condimentum nisl. Nulla facilisi. Mauris eu turpis mauris. Nunc at turpis elit, et mattis purus. Proin varius, nunc rhoncus consectetur dignissim, lacus augue accumsan sem, nec pretium magna est a massa. Duis eu justo arcu. Curabitur diam ligula, semper non blandit ut, sodales ac dui.</p> <p class="postmetadata"> Filed under: <a href="http://localhost/wordpress/?cat=1" title="View all posts in Uncategorized" rel="category">Uncategorized</a> by admin <br /> <a href="http://localhost/wordpress/?p=3#respond" title="Comment on Teste Post 1">No Comments »</a> | <a class="post-edit-link" href="http://localhost/wordpress/wp-admin/post.php?action=edit&post=3" title="Edit post">Edit</a> </p> </div> </div> <h2><a href="http://localhost/wordpress/?p=1"> Hello world! </a></h2> <div class="post" id="post-1"> <div class="entry"> <p>Welcome to WordPress. This is your first post. Edit or delete it, then start blogging!</p> <p class="postmetadata"> Filed under: <a href="http://localhost/wordpress/?cat=1" title="View all posts in Uncategorized" rel="category">Uncategorized</a> by admin <br /> <a href="http://localhost/wordpress/?p=1#comments" title="Comment on Hello world!">1 Comment »</a> | <a class="post-edit-link" href="http://localhost/wordpress/wp-admin/post.php?action=edit&post=1" title="Edit post">Edit</a> </p> </div> </div> <div class="navigation"> </div> </div> <div class="sidebar"> <ul> <li id="search"> <form method="get" id="searchform" action="http://localhost/wordpress/"> <div> <input type="text" value="" name="s" id="s" size="15" /><br /> <input type="submit" id="searchsubmit" value="Search" /> </div> </form> <li class="pagenav"><h2>Pages</h2><ul><li class="page_item page-item-2"><a href="http://localhost/wordpress/?page_id=2" title="About">About</a></li> </ul></li> </li> <li> <h2> Categories </h2> <ul> <li class="cat-item cat-item-1"><a href="http://localhost/wordpress/?cat=1" title="View all posts filed under Uncategorized">Uncategorized</a> (4) </li> </ul> </li> <li> <h2> Archives </h2> <ul> <li><a href='http://localhost/wordpress/?m=201003' title='March 2010'>March 2010</a></li> </ul> </li> <li id="linkcat-2" class="linkcat"><h2>Blogroll</h2> <ul> <li><a href="http://wordpress.org/development/">Development Blog</a></li> <li><a href="http://codex.wordpress.org/">Documentation</a></li> <li><a href="http://wordpress.org/extend/plugins/">Plugins</a></li> <li><a href="http://wordpress.org/extend/ideas/">Suggest Ideas</a></li> <li><a href="http://wordpress.org/support/">Support Forum</a></li> <li><a href="http://wordpress.org/extend/themes/">Themes</a></li> <li><a href="http://planet.wordpress.org/">WordPress Planet</a></li> </ul> </li> <li> <h2> Meta </h2> <ul> <li><a href="http://localhost/wordpress/wp-admin/">Site Admin</a></li> <li> <a href="http://localhost/wordpress/wp-login.php?action=logout&_wpnonce=ee45c3c988">Log out</a> </li> </ul> </li> </ul> </div> <div id="footer"> <p> Copyright © 2010 Blog</p> </div> </body> </html>

Read the article

PHP form auto response

- by Mark

Hi, I am using the following php code which has been given to me, it works fine, apart from the auto response bit. I know its not a lot of code I just dont know how to do it or why it snot working. Any help would be appreciated. thanks in advance. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title> - Contact Us</title>  <link rel="stylesheet" type="text/css" href="css/reset.css" /> <link rel="stylesheet" type="text/css" href="css/styles.css" /> <link rel="stylesheet" type="text/css" href="css/colorbox.css" />  <?php require_once('includes/js.php'); ?> </head> <body> <?php //FIll out the settings below before using this script $your_email = "(email address)"; $website = "(website name)"; //BOTS TO BLOCK $bots = "/(Indy|Blaiz|Java|libwww-perl|Python|OutfoxBot|User-Agent|PycURL|AlphaServer|T8Abot|Syntryx|WinHttp|WebBandit|nicebot)/i"; //Check if known bot is visiting if (preg_match($bots, $_SERVER["HTTP_USER_AGENT"])) { exit ("Sorry bots are not allowed here!"); } //Known Exploits $exploits = "/(content-type|bcc:|cc:|from:|reply-to:|javascript|onclick|onload)/i"; //Spam words $spam_words = "/(viagra|poker|blackjack|porn|sex)/i"; // BAD WORDS $words = "/( bitch|dick|pussy|pussies|ass|fuck|cum|cumshot|cum shot| gangbang|gang bang|god dammit|goddammit|viagra|anus|analsex )/i"; //BAD WORD/SPAM WORD/EXPLOIT BLOCKER function wordBlock($word) { //Make variables global global $words; global $exploits; global $spam_words; if (preg_match($words, $word)) { $word = preg_replace($words, "#####", $word); } if(preg_match($exploits,$word)){ $word = preg_replace($exploits,"",$word); } if(preg_match($spam_words,$word)){ $word = preg_replace($spam_words,"$$$$",$word); } return $word; } //CLean data function function dataClean($data) { $data = stripslashes(trim(rawurldecode(strip_tags($data)))); return $data; } //CREATE MAIN VARIABLES $name = (isset ($_POST['name'])) ? dataClean($_POST['name']) : FALSE; $company = (isset ($_POST['company'])) ? dataClean($_POST['company']) : FALSE; $address = (isset ($_POST['address'])) ? dataClean($_POST['address']) : FALSE; $postcode = (isset ($_POST['postcode'])) ? dataClean($_POST['postcode']) : FALSE; $phone = (isset ($_POST['phone'])) ? dataClean($_POST['phone']) : FALSE; $email = (isset ($_POST['email'])) ? dataClean($_POST['email']) : FALSE; $comment = (isset ($_POST['message'])) ? wordBlock(dataClean($_POST['message'])) : FALSE; $submit = (isset ($_POST['send'])) ? TRUE : FALSE; $email_check = "/^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,6}$/i"; //$ip = $_SERVER["REMOTE_ADDR"]; $errors = array(); //Check if send button was clicked if ($submit) { if (!$name) { $errors[] = "Please enter a name!"; } if ($name) { if (!ereg("^[A-Za-z' -]*$", $name)) { $errors[] = "You may not use special characters in the name field!"; } } if (!$email) { $errors[] = "Please enter an email address!"; } if ($email) { if (!preg_match($email_check, $email)) { $errors[] = "The E-mail you entered is invalid!"; } } /* if (!$subject) { $errors[] = "Please enter an email subject!"; } */ if (!$comment) { $errors[] = "Please don't leave the message field blank!"; } //Check if any errors are present if (count($errors) > 0) { foreach ($errors AS $error) { print "• $error <br />"; } } else { //MESSAGE TO SEND TO ADMIN //Create main headers $headers = "From: " . $website . " <$your_email> \n"; $headers .= "Reply-to:" . $email . " \n"; $headers .= "MIME-Version: 1.0\n"; $headers .= "Content-Transfer-Encoding: 8bit\n"; $headers .= "Content-Type: text/html; charset=UTF-8\n"; $message = ""; $message .= "<h1>New E-Mail From " . $website . "</h1><br /><br />"; $message .= "<b>Name:</b> " . $name . "<br />"; $message .= "<b>Company:</b> " . $company . "<br />"; $message .= "<b>Address:</b> " . $address . "<br />"; $message .= "<b>Postcode:</b > " . $postcode . "<br />"; $message .= "<b>Phone No:</b> " . $phone . "<br />"; $message .= "<b>E-mail:</b> " . $email . "<br />"; $message .= "<b>Message:</b> " . $comment . "<br />"; //E-mails subject $mail_subject = "Message from " . $website . ""; /* CHECK TO BE SURE FIRST E-MAIL TO ADMIN IS A SUCCESS AND SEND EMAIL TO ADMIN OTHERWISE DON'T SEND AUTO RESPONCE */ if (mail($your_email, $mail_subject, $message, $headers)) { //UNSET ALL VARIABLES unset ($name, $email, $company, $address, $postcode, $phone, $comment, $_REQUEST); //JAVASCRIPT SUCCESS MESSAGE echo " <script type='text/javascript' language='JavaScript'> alert('Your message has been sent'); </script> "; //SUCCESS MESSAGE TO SHOW IF JAVASCRIPT IS DISABLED echo "<noscript><p>THANK YOU YOUR MESSAGE HAS BEEN SENT</p></noscript>"; /* -----------------END MAIL BLOCK FOR SENDING TO ADMIN AND START AUTO RESPONCE SEND----------------- */ //AUTO RESPONCE MESSAGE //Create main headers $headers = "From: " . $website . " <$your_email> \n"; $headers .= "Reply-to:" . $your_email . " \n"; $headers .= "MIME-Version: 1.0\n"; $headers .= "Content-Transfer-Encoding: 8bit\n"; $headers .= "Content-Type: text/html; charset=UTF-8\n"; $message = ""; $message .= "<h1>Thank You For Contacting Us </h1><br /><br />"; $message .= "On behalf of <b>" . $website . "</b> we wanna thank you for contacting us and to let you know we will respond to your message as soon as possible thank you again."; //E-mails subject $mail_subject = "Thank you for contacting " . $website . ""; //Send the email mail($email, $mail_subject, $message, $headers); /* -----------------END MAIL BLOCK FOR SENDING AUTO RESPONCE ----------------- */ } else { echo " <script type='text/javascript' language='JavaScript'> alert('Sorry could not send your message'); </script> "; echo "<noscript><p style='color:red;'>SORRY COULD NOT SEND YOUR MESSAGE</p></noscript>"; } } } ?> <div id="wrapper"> <div id="grad_overlay">  <div id="header"> <a href="index.php" title="Regal Balustrades"><img src="images/regal_logo.png" alt="Regal Balustrades" /></a> <div id="strapline"> <img src="images/strapline.png" alt="Architectural metalwork systems" /> </div> </div>  <div id="nav"> <?php require_once('includes/nav.php'); ?> </div>  <div id="content"> <div id="details"> <p class="getintouch env">Get In Touch</p> <ul class="details"> <li>T. (0117) 935 3888</li> <li>F. (0117) 967 7333</li> <li>E. <a href="mailto:[email protected]" title="Contact via email">[email protected]</a></li> </ul> <p class="whereto hse">Where To Find Us</p> <ul class="details"> <li>Regal Balustrades</li> <li>Regal House, </li> <li>Honey Hill Road,</li> <li>Kingswood, </li> <li>Bristol BS15 4HG</li> </ul> </div> <div id="contact"> <h1>Contact us</h1> <p>Please use this form to request further information about Regal Balustrades and our services. To speak to a member of our staff in person, please call us on 0117 9353888</p> <div id="form"> <form method='POST' action='<?php echo "".$_SERVER['PHP_SELF'].""; ?>'> <p class='form-element'> <label for='name'>Name:</label> <input type='text' name='name' value='<?php echo "" . $_REQUEST['name'] . "";?>' /> </p> <p class='form-element'> <label for='company'>Company:</label> <input type='text' name='company' value='<?php echo "" . $_REQUEST['company'] . "";?>' /> </p> <p class='form-element'> <label for='address'>Address:</label> <textarea name='address' rows='5' id='address' class='address' ><?php echo "" . $_REQUEST['address'] . "";?></textarea> </p> <p class='form-element'> <label for='postcode'>Postcode:</label> <input type='text' name='postcode' value='<?php echo "" . $_REQUEST['postcode'] . "";?>' /> </p> <p class='form-element'> <label for='phone'>Telephone:</label> <input type='text' name='phone' value='<?php echo "" . $_REQUEST['phone'] . "";?>' /> </p> <p class='form-element'> <label for='email'>Email:</label> <input type='text' name='email' value='<?php echo "" . $_REQUEST['email'] . "";?>' /> </p> </div> <div id='form-right'> <p class='form-element'> <label for='message'>Enquiry:</label> <textarea name='message' class='enquiry' id='enquiry' rows='5' cols='40' ><?php echo "" . $_REQUEST['message'] . "";?></textarea> </p> <p class='form-element'> <input type='submit' class='submit' name='send' value='Send message' /> </p> </div> <p class='nb'><em>We will respond as soon as possible.</em></p> </form> </div> </div> </div> </div> </div>  <div id="footer-container"> <?php require_once('includes/footer.php'); ?> </div>  <script> $(document).ready(function() { $("ul#navig li:nth-child(6)").addClass("navon"); }); </script> </body> </html>

Read the article

Please help! Every Post link links to the most recent post Wordpress

- by kwek-kwek

I got the site up on time, with one blog post up. Later I added another one and tested it. Big problem! Any link that used to take you to the old post (ie: side-bar "Recent Posts" links) now takes you to the newest one. I tested it by adding a third post, and got the same result. This is a custom wordpress theme and I have a, page.php <?php get_header(); ?> <?php if (have_posts()) : while (have_posts()) : the_post(); ?> <div id="BodyWrap">  <div id="mainCont"> <?php get_sidebar(); ?> <?php if (is_page(array('home'))) { ;?> <div id="rotateBanner"> <div id="slide-holder"> <div id="slide-runner"> <img id="slide-img-1" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial2.jpg" class="slide" alt="" /> <img id="slide-img-5" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial5.jpg" class="slide" alt="" /> <img id="slide-img-2" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial1.jpg" class="slide" alt="" /> <img id="slide-img-6" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial6.jpg" class="slide" alt="" /> <img id="slide-img-3" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial3.jpg" class="slide" alt="" /> <img id="slide-img-7" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial7.jpg" class="slide" alt="" /> <img id="slide-img-4" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial4.jpg" class="slide" alt="" /> <img id="slide-img-8" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial8.jpg" class="slide" alt="" /> <div id="slide-controls"> <p id="slide-client" class="text" style="display:none;"><span></span></p> <p id="slide-desc" class="text" style="display:none;"></p> <p id="slide-nav" style="display:none;"></p> </div> </div> <script type="text/javascript"> if(!window.slider) var slider={};slider.data=[{"id":"slide-img-1","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-5","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-2","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-6","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-3","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-7","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-4","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-8","client":"nature beauty","desc":"nature beauty photography"}]; </script> </div> </div> <?php } ?> <?php if (is_page(array('accueil'))) { ;?> <div id="rotateBanner"> <div id="slide-holder"> <div id="slide-runner"> <img id="slide-img-1" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial1-fr.jpg" class="slide" alt="" /> <img id="slide-img-5" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial5-fr.jpg" class="slide" alt="" /> <img id="slide-img-2" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial2-fr.jpg" class="slide" alt="" /> <img id="slide-img-6" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial6-fr.jpg" class="slide" alt="" /> <img id="slide-img-3" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial3-fr.jpg" class="slide" alt="" /> <img id="slide-img-7" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial7-fr.jpg" class="slide" alt="" /> <img id="slide-img-4" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial4-fr.jpg" class="slide" alt="" /> <img id="slide-img-8" src="<?php bloginfo('template_url'); ?>/images/banner/testimonial8-fr.jpg" class="slide" alt="" /> <div id="slide-controls"> <p id="slide-client" class="text" style="display:none;"><span></span></p> <p id="slide-desc" class="text" style="display:none;"></p> <p id="slide-nav" style="display:none;"></p> </div> </div> <script type="text/javascript"> if(!window.slider) var slider={};slider.data=[{"id":"slide-img-1","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-5","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-2","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-6","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-3","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-7","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-4","client":"nature beauty","desc":"nature beauty photography"},{"id":"slide-img-8","client":"nature beauty","desc":"nature beauty photography"}]; </script> </div> </div> <?php } ?> <?php if (is_page(array('contact-us'))) { ;?> <div id="rotateBanner"> <?php custom_field_image() ?> </div> <?php } ?> <div id="mainCopy"> <div id="content"> <h2> <?php if (is_page('home','accueil')) : ?> <?php else : ?> <?php single_post_title(); ?> <?php endif; ?></h2> <?php the_content('<p class="serif">Read the rest of this page »</p>'); ?> <?php wp_link_pages(array('before' => '<p><strong>Pages:</strong> ', 'after' => '</p>', 'next_or_number' => 'number')); ?> </div> </div> <?php if (is_page(array('home','accueil'))) { ;?> <div id="rightCol2"> <div id="Fworks"> <h2>Featured work</h2> <li><img src="<?php bloginfo('template_url'); ?>/images/portage-thumb.jpg" width="234" height="92" border="0" alt="" /></li> <li><a href="<?php bloginfo('url'); ?>our-work/foundation-on-antivirals"><img src="<?php bloginfo('template_url'); ?>/images/fav-thumb.jpg" width="234" height="92" border="0" alt="" /></a></li> <li><img src="<?php bloginfo('template_url'); ?>/images/danslejardin-thumb.jpg" width="234" height="92" border="0" alt="" /></li> </div> <div id="NewEvents"> <?php if ( (strtolower(ICL_LANGUAGE_CODE) == 'en') ) {echo("<h2>News & Events</h2");} ?> <?php if ( (strtolower(ICL_LANGUAGE_CODE) == 'fr')) echo("<h2>Nouvelles</h2") ?> <div id="NewsListings"> <ul> <?php //dbem_get_events_list("limit=5&scope=al&order=DESC"); ?> <?php include('events.php');?> </ul> </div> </div> </div> <?php } ?> </div> </div> <?php endwhile; endif; ?> <?php get_footer(); ?> single.php <?php /** * @package WordPress * @subpackage Default_Theme */ get_header(); ?> <div id="BodyWrap">  <div id="mainCont"> <?php get_sidebar(); ?> <?php if (is_page(array('home','contact-us'))) { ;?> <div id="rotateBanner"> <?php custom_field_image() ?> </div> <?php } ?> <div id="mainCopy"> <div id="content" class="widecolumn" role="main"> <?php if (have_posts()) : while (have_posts()) : the_post(); ?>  <div <?php post_class() ?> id="post-<?php the_ID(); ?>"> <h2><?php the_title(); ?></h2> <div class="entry"> <?php the_content('<p class="serif">Read the rest of this entry »</p>'); ?> <?php wp_link_pages(array('before' => '<p><strong>Pages:</strong> ', 'after' => '</p>', 'next_or_number' => 'number')); ?> <?php the_tags( '<p>Tags: ', ', ', '</p>'); ?>  </div> </div> <?php comments_template(); ?> <?php endwhile; else: ?> <p>Sorry, no posts matched your criteria.</p> <?php endif; ?> </div> </div> </div> </div> <?php get_footer(); ?> index.php <?php get_header(); ?>  <div id="BodyWrap">  <div id="mainCont"> <?php get_sidebar(); ?> <div id="mainCopy"> <div id="content"> <?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?> <div id="BGHeadTitle"><h2><a href="<?php the_permalink() ?>"><?php the_title(); ?></a></h2></div> <?php the_content(); ?> <p><?php the_time('F j, Y'); ?> at <?php the_time('g:i a'); ?> | <?php the_category(', '); ?> | <?php comments_number('No comment', '1 comment', '% comments'); ?></p> <?php comments_template(); // Get wp-comments.php template ?> <?php endwhile; else: ?> <h2>Woops...</h2> <p>Sorry, no posts we're found.</p> <?php endif; ?> <p align="center"><?php posts_nav_link(); ?></p> </div> </div> </div> </div> <?php get_footer(); ?> my recent post code : <ul> <?php query_posts('cat=3,4,5&posts_per_page=5&order=ASC&orderby=date'); if ( have_posts() ) : while ( have_posts() ) : the_post()?> <li> <span class="date"><?php the_time('M j') ?></span> <a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a> </li> <?php endwhile; ?> <?php rewind_posts(); ?> </ul> I am really stuck the site went live and when I was working on the testserver I only noticed it.view the site here »

Read the article

Full Screen Video Tumblr

- by Kodi Lane

I have a tumblr theme seen on http://www.kodilane.com and i am trying to make my Video Posts full screen. I have tried editing the code but i can only get the pictures to stretch. I have attached the template i have so far, if you can spot the changes that need to be done to make the video posts stretch full screen like the pictures do i would really appreciate it. Thank You - Kodi <!DOCTYPE html> <html lang="en"> <head> <title>{Title} {block:PostSummary}- {PostSummary}{/block:PostSummary}</title> <link rel="shortcut icon" href="{Favicon}"> <link rel="alternate" type="application/rss+xml" href="{RSS}"> {block:Description} <meta name="description" content="{MetaDescription}" /> {/block:Description} <meta http-equiv="content-type" content="text/html; charset=utf-8" /> {block:Posts} <meta name="if:Reverse Description" content="0"/> <meta name="if:Include Attribution" content="1"/> <meta name="image:Background" content="http://static.tumblr.com/ffvtarv/QxLlmnswt/kims4.jpeg"/> <meta name="font:Body" content="Arial, Helvetica, sans"/> <meta name="color:Body Text" content="#fff"/> <meta name="color:Link" content="#d5d5d5"/> <meta name="color:Hover" content="#fff"/> <style type="text/css"> html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } /* HTML5 display-role reset for older browsers */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } body { line-height: 1; font-family: {font:Body}; } ol, ul, .bigcats li { list-style: none; } .main ol{ list-style:decimal; margin-left:25px; margin-bottom:10px; } .main ul{ list-style: disc; margin-left:25px; margin-bottom:10px; } blockquote, q { quotes: none; font-style: italic; padding:7px 7px; display:block; } ol.notes blockquote a{ line-height:22px; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } table { border-collapse: collapse; border-spacing: 0; } strong{ color:#9d9d9d; font-weight: bold; } em{ font-style: italic; } {block:IfNotReverseDescription} .article{ max-width:420px; position:fixed; bottom:43px; right:0; } {/block:IfNotReverseDescription} {block:IfReverseDescription} .article{ max-width:420px; position:fixed; bottom:43px; left:0; } {/block:IfReverseDescription} h1, h2{ position:absolute; top:-9999px; left:-9999px; } .nav{ width:100%; padding: 10px 0px 10px 0px; text-align:left; z-index: 10; color:{color:Link}; margin-left:5px; } .navwrap{ background-color:#000; position:fixed; width:100%; bottom:0px; clear:both; /* Firefox 3.6+ */ background: -moz-linear-gradient(left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0.8)); /* Safari 4-5, Chrome 1-9 */ background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0.8))); /* Safari 5.1+, Chrome 10+ */ background: -webkit-linear-gradient(left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0.8)); /* Opera 11.10+ */ background: -o-linear-gradient(left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0.8)); padding-bottom:2px; box-shadow:0px 0px 3px #000000; } .nav ul li{ display:inline; font-size:13px; text-transform:uppercase; color:{color:Link}; list-style:none; text-align:center; } .nav li{ list-style: none; } .nav ul li a, .nav ul li a:visited { color:{color:Link}; padding: 10px 10px 3px 10px; } .nav ul li a:hover{ color:{color:Hover}; } a{ text-decoration:none; } .main a{ border-bottom: 1px {color:Link} dotted; color: {color:Link}; padding: 0 1px; } .main a:hover, .main a:focus{ color:{color:Hover}; border-bottom: transparent 1px solid; } a:visited, .main a:visited, { color: {color:Link}; } a:active {outline: none;} ol.notes, ol.notes li{ margin-bottom:2px; line-height:16px; } .audiometa{ padding-bottom:10px; } h3.push{ margin-bottom:10px; } h3{ margin-bottom:10px; } h3 a{ margin-bottom:10px; font-size:16px; color:{color:Hover}; } .main, .tags{ color:{color:Body Text}; display:block; padding: 15px; font-size: 12px; line-height: 16px; text-align: left; /* fallback */ background-color: #000; /* Firefox 3.6+ */ background: -moz-linear-gradient(left, rgba(0, 0, 0, .8), rgba(0, 0, 0, 0.6)); /* Safari 4-5, Chrome 1-9 */ background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, .8)), to(rgba(0, 0, 0, 0.6))); /* Safari 5.1+, Chrome 10+ */ background: -webkit-linear-gradient(left, rgba(0, 0, 0, .8), rgba(0, 0, 0, 0.6)); /* Opera 11.10+ */ background: -o-linear-gradient(left, rgba(0, 0, 0, .8), rgba(0, 0, 0, 0.6)); margin-top:5px; box-shadow:0px 0px 3px #000000 } .tags{ padding: 5px 15px; padding-bottom:7px; } .main iframe, .main embed{ margin-left:-5px; margin-top:-5px; } a.more-link, .tags a, .meta a{ line-height:18px; font-size:10px; border-bottom: 1px #888 dotted; color: {color:Link}; padding: 0 1px; margin: 0 2px; } p.meta{ margin-bottom:5px; } .tags a:hover, a.more-link:hover{ color:{color:Hover}; border-bottom: 1px #FFF dotted; } .pagination{ color: {color:Body Text}; padding: 10px 15px; font-size: 10px; line-height: 16px; text-align: left; /* fallback */ background-color: #000; /* Firefox 3.6+ */ background: -moz-linear-gradient(left, rgba(0, 0, 0, .8), rgba(0, 0, 0, 0.6)); /* Safari 4-5, Chrome 1-9 */ background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, .8)), to(rgba(0, 0, 0, 0.6))); /* Safari 5.1+, Chrome 10+ */ background: -webkit-linear-gradient(left, rgba(0, 0, 0, .8), rgba(0, 0, 0, 0.6)); /* Opera 11.10+ */ background: -o-linear-gradient(left, rgba(0, 0, 0, .8), rgba(0, 0, 0, 0.6)); margin-top:5px; box-shadow:0px 0px 3px #000000 } .pagination:hover{ /* Firefox 3.6+ */ background: -moz-linear-gradient(left, rgba(0, 0, 0, .6), rgba(0, 0, 0, 0.8)); /* Safari 4-5, Chrome 1-9 */ background: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, .6)), to(rgba(0, 0, 0, 0.8))); /* Safari 5.1+, Chrome 10+ */ background: -webkit-linear-gradient(left, rgba(0, 0, 0, .6), rgba(0, 0, 0, 0.8)); /* Opera 11.10+ */ background: -o-linear-gradient(left, rgba(0, 0, 0, .6), rgba(0, 0, 0, 0.8)); } #nextslide { width:48%; height:100%; background: url(http://static.tumblr.com/szanjxb/vI6lmo15u/forward.png) no-repeat right center, url(http://static.tumblr.com/ffvtarv/gemlmnsks/next-shadow.png) repeat-y right; position:fixed; top:0; right:0; float:left; opacity:0; filter:alpha(opacity=0); -webkit-transition: opacity .5s ease-out; -moz-transition: opacity .5s ease-out; -o-transition: opacity .5s ease-out; overflow:none; } p{ margin-bottom: 10px; } p:last-child{ margin-bottom: 0px; } #prevslide{ width:48%; float:left; height:100%; background: url(http://static.tumblr.com/szanjxb/MSClmo15g/back.png) no-repeat left center, url(http://static.tumblr.com/ffvtarv/bKulmnsl6/prev-shadow.png) repeat-y left; position:fixed; top: 0; left: 0; opacity:0; filter:alpha(opacity=0); -webkit-transition: opacity .5s ease-out; -moz-transition: opacity .5s ease-out; -o-transition: opacity .5s ease-out; } #nextslide:hover, #prevslide:hover{ filter:alpha(opacity=100); opacity:1.0; -webkit-transition: opacity .2s ease-out; -moz-transition: opacity .2s ease-out; -o-transition: opacity .2s ease-out; } p.time{ padding-bottom:10px; margin-bottom:10px; text-align: right; } .left{ float:left; } .right{ float:right; } .button{ position:fixed; bottom: 9px; right: 15px; line-height:12px; font-size:13px; color:{color:Link}; cursor: pointer; float:left; padding-bottom:1px; border-bottom: 2px solid transparent; } .button:hover{ color:{color:Link}; } .notes{ line-height: 11px; } ol.notes li{ list-style: none; } .clear { clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0; } .hidden{ display:none; } {block:Photo} body {background: url({PhotoURL-HighRes}) no-repeat center center fixed black; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;} {/block:Photo} {block:Text} body {background: url({image:Background}) no-repeat center center fixed black; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;} {/block:Text} {block:Video} body {background: url({image:Background}) no-repeat center center fixed black; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;} {/block:Video} {block:Quote} body {background: url({image:Background}) no-repeat center center fixed black; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;} {/block:Quote} {block:Link} body {background: url({image:Background}) no-repeat center center fixed black; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;} {/block:Link} {block:Audio} body {background: url({image:Background}) no-repeat center center fixed black; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;} {block:AlbumArt} body{ background: url({AlbumArtURL}) no-repeat center center fixed black; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; } {/block:AlbumArt} {/block:Audio} {block:Answer} body {background: url({image:Background}) no-repeat center center fixed black; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;} {/block:Answer} {block:Chat} body {background: url({image:Background}) no-repeat center center fixed black; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;} {/block:Chat} {CustomCSS} </style> <script src="http://static.tumblr.com/ffvtarv/W6Llmnske/jquery-git.js"></script> <script src="http://static.tumblr.com/ffvtarv/QpUlmnsje/jquery.cookie.js"></script> <script> var uiStatus = $.cookie("uiStatus") $(document).ready(function(){ if(uiStatus == 'hidden') { $(".article,.navwrap").hide() }; $(".button").click(function () { $(".article,.navwrap").fadeToggle("slow", "swing"); if(uiStatus == 'hidden') { $.cookie("uiStatus", "visible"); } else { $.cookie("uiStatus", "hidden"); }; }); }); </script> </head> <h1><a href="/">{Title}</a></h1> <h2>{Description}</h2>  {block:Pagination} {block:PreviousPage} <a href="{PreviousPage}" title="Next Post"><div id="nextslide"></div></a> {/block:PreviousPage} {block:NextPage} <a href="{NextPage}" title="Previous Post"><div id="prevslide"></div></a> {/block:NextPage} {/block:Pagination} {block:PermalinkPagination} {block:PreviousPost} <a href="{PreviousPost}" title="Previous Post"><div id="prevslide"></div></a> {/block:PreviousPost} {block:NextPost} <a href="{NextPost}" title="Next Post"><div id="nextslide"></div></a> {/block:NextPost} {/block:PermalinkPagination} <div class="article"> {block:Pagination} {block:PreviousPage} <a href="{PreviousPage}" title="Newer Post"><div class="pagination">Newer Post</div></a> {/block:PreviousPage} {block:NextPage} <a href="{NextPage}" title="Older Post"><div class="pagination">Older Post</div></a> {/block:NextPage} {/block:Pagination} {block:PermalinkPagination} {block:NextPost} <a href="{NextPost}" title="Newer Post"><div class="pagination">Newer Post</div></a> {/block:NextPost} {block:PreviousPost} <a href="{PreviousPost}" title="Older Post"><div class="pagination">Older Post</div></a> {/block:PreviousPost} {/block:PermalinkPagination} {block:HasTags} <div class="tags"> {block:Tags} <a href="{TagURL}">{Tag}</a> {/block:Tags} </div> {/block:HasTags} <div class="main"> {block:Photo} {block:Caption} {Caption} {/block:Caption} {/block:Photo} {block:Video} {Video-400} {block:Caption} {Caption} {/block:Caption} {/block:Video} {block:Link} <h3><a href="{URL}" target="{Target}">{Name}</a></h3> {block:Description} {Description} {/block:Description} {/block:Link} {block:Quote} <h3>{Quote}</h3> {block:Source} <strong><p>{Source}</p></strong> {/block:Source} {/block:Quote} {block:Audio} {AudioPlayerBlack} <div class="audiometa"> {block:Artist} {Artist} {/block:Artist} {block:Album} {Album} {/block:Album} {block:TrackName} {TrackName} {/block:TrackName} </div> {block:Caption} {Caption} {/block:Caption} {/block:Audio} {block:Chat} <h3 class="push">{Title}</h3> {block:Lines} <p class="chat {Alt}"><strong>{block:Label}{Label}{/block:Label}</strong> {Line}</p> {/block:Lines} {/block:Chat} {block:Text} {Body} {block:Text} <p class="meta"> <a href="http://tmv.proto.jp/reblog.php?post_url={Permalink};" title="Reblog this" class="more-link left">Reblog</a> <span class="hidden">{block:Photo}{LinkOpenTag}Source{LinkCloseTag}{/block:Photo}</span> <a href="{Permalink}" title="Permalink{PhotoAlt}" class="more-link right notes">{NoteCountWithLabel}</a> </p> <div class="clear"></div> </div> </div> <script type="text/javascript"> document.onkeyup = KeyCheck; function KeyCheck(e) { var KeyID = (window.event) ? event.keyCode : e.keyCode; switch(KeyID) { {block:Pagination} {block:PreviousPage} case 39: window.location = "{PreviousPage}"; break; {/block:PreviousPage} {block:NextPage} case 37: window.location = "{NextPage}"; break; {/block:NextPage} {/block:Pagination} {block:PermalinkPagination} {block:PreviousPost} case 39: window.location = "{NextPost}"; break; {/block:PreviousPost} {block:NextPost} case 37: window.location = "{PreviousPost}"; break; {/block:NextPost} {/block:PermalinkPagination} } } </script> <div class="navwrap"> <div class="nav"> <ul> <li><a href="/" title="{Title}">KODI LANE</a></li> <li><a href="/archive" title="Archive of posts">Archive</a></li> {block:AskEnabled}<li><a href="/ask" title="Ask">{AskLabel}</a></li>{/block:AskEnabled} {block:SubmissionsEnabled}<li><a href="/submit" title="Submit">{SubmitLabel}</a></li>{/block:SubmissionsEnabled} {block:HasPages}{block:Pages}<li><a href="{URL}">{Label}</a></li>{/block:Pages}{/block:HasPages} {block:IfIncludeAttribution}<li><a href="http://jonathanhaggard.com/">Theme by Jon</a></li>{/block:IfIncludeAttribution} </ul> </div> </div> <div class="button">HIDE/SHOW UI</div> {/block:Posts}

Read the article

How to change image through click - javascript

- by Elmir Kouliev

I have a toolbar that has 5 table cells. The first cell looks clear, and the other 4 have a shade over them. I want to make it so that clicking on the table cell will also change the image so that the shade will also change in respect to the current table cell that is selected. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <title>X?B?RL?R V? HADIS?L?R</title> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <link rel="stylesheet" href="N&SAz.css" /> <link rel="shortcut icon" href="../../Images/favicon.ico" /> <script type="text/javascript"> var switchTo5x = true; </script> <script type="text/javascript" src="http://w.sharethis.com/button/buttons.js"></script> <script type="text/javascript"> stLight.options({ publisher: "581d0c30-ee9d-4c94-9b6f-a55e8ae3f4ae" }); </script> <script src="../../jquery-1.7.2.min.js" type="text/javascript"> </script> <script type="text/javascript"> $(document).ready(function () { $(".fade").css("display", "none"); $(".fade").fadeIn(20); $("a.transition").click(function (event) { event.preventDefault(); linkLocation = this.href; $("body").fadeOut(500, redirectPage); }); function redirectPage() { window.location = linkLocation; } }); $(document).ready(function () { $('.preview').hide(); $('#link_1').click(function () { $('#latest_story_preview1').hide(); $('#latest_story_preview2').hide(); $('#latest_story_preview3').hide(); $('#latest_story_preview4').hide(); $('#latest_story_main').fadeIn(800); }); $('#link_2').click(function () { $('#latest_story_main').hide(); $('#latest_story_preview2').hide(); $('#latest_story_preview3').hide(); $('#latest_story_preview4').hide(); $('#latest_story_preview1').fadeIn(800); }); $('#link_3').click(function () { $('#latest_story_main').hide(); $('#latest_story_preview1').hide(); $('#latest_story_preview3').hide(); $('#latest_story_preview4').hide(); $('#latest_story_preview2').fadeIn(800); }); $('#link_4').click(function () { $('#latest_story_main').hide(); $('#latest_story_preview1').hide(); $('#latest_story_preview2').hide(); $('#latest_story_preview4').hide(); $('#latest_story_preview3').fadeIn(800); }); $('#link_5').click(function () { $('#latest_story_main').hide(); $('#latest_story_preview1').hide(); $('#latest_story_preview2').hide(); $('#latest_story_preview3').hide(); $('#latest_story_preview4').fadeIn(800); }); $(".fade").css("display", "none"); $(".fade").fadeIn(1200); $("a.transition").click(function (event) { event.preventDefault(); linkLocation = this.href; $("body").fadeOut(500, redirectPage); }); }); </script> </head> <body id="body" style="background-color:#FFF;" onload="document"> <div style="margin:0px auto;width:1000px;" id="all_content"> <div id="top_content" style="background-color:transparent;"> <ul id="translation_list"> <li> <a href=""> AZ </a> </li> <li> <a href="#"> RUS </a> </li> <li> <a href="#"> ENG </a> </li> </ul> <div id="share_buttons"> <span class='st_facebook' displayText='' title="Facebook"></span> <span class='st_twitter' displayText='' title="Twitter"></span> <span class='st_linkedin' displayText='' title="Linkedin"></span> <span class='st_googleplus' displayText='' title="Google +"></span> <span class='st_email' displayText='' title="Email"></span> </div> <img src="../../Images/RasulGuliyev.png" width="330" height="80" id="top_logo"> <br /> <br /> <div class="fade" id="navigation"> <ul> <font face="Verdana, Geneva, sans-serif"> <li> <a href="../../index.html"> ANA S?HIF? </a> </li> <li> <a href="../biographyAZ.html"> BIOQRAFIYA </a> </li> <li style="background-color:#9C1A35;"> <a href="#"> X?B?RL?R V? HADIS?L?R </a> </li> <li> <a> PROQRAM </a> </li> <li> <a> SEÇICIL?R </a> </li> <li> <a> ?LAQ?L?R</a> </li> </font> </ul> </div> <font face="Tahoma, Geneva, sans-serif"> <br /> <div id="navigation2"> <ul> <a> <li><i> HADIS?L?R </i></li> </a> <a> <li><i>VIDEOLAR</i> </li> </a> </ul> </div> <div id="news_section" style="background-color:#FFF;"> <h3 style="font-weight:100; font-size:22px; font-style:normal; color:#7C7C7C;">Son X?b?rl?r</h3> <div class="fade" id="Latest-Stories"> <table id="stories-preview" width="330" height="598" border="0" cellpadding="0" cellspacing="0"> <tr> <td> <a id="link_1" href="#"><img src="../../Images/N&EImages/images/Article-Nav-Bar1_01.gif" width="330" height="114" alt=""></a> </td> </tr> <tr> <td> <a id="link_2" href="#"> <img src="../../Images/N&EImages/images/Article-Nav-Bar1_02.gif" width="330" height="109" alt=""> </a> </td> </tr> <tr> <td> <a id="link_3" href="#"> <img src="../../Images/N&EImages/images/Article-Nav-Bar1_03.gif" width="330" height="132" alt=""></a> </td> </tr> <tr> <td> <a id="link_4" href="#"><img src="../../Images/N&EImages/images/Article-Nav-Bar1_04.gif" width="330" height="124" alt=""></a> </td> </tr> <tr> <td> <a id="link_5" href="#"><img src="../../Images/N&EImages/images/Article-Nav-Bar1_05.gif" width="330" height="119" alt=""></a> </td> </tr> </table> <div class="fade" id="latest_story_main">  <img src="../../Images/N&EImages/GuliyevFace.jpeg" style="padding:4px; margin-top:6px; border-style:groove; border-width:thin; margin-left:90px;" /> <a href="#"> <h2 style="font-weight:100; font-style:normal;"> "Bizim V?zif?miz Az?rbaycan Xalqinin T?zyiq? M?ruz Qalmamasini T?min Etm?kdir" </h2> </a> <h5 style="font-weight:100; font-size:12px; color:#888; opacity:.9;"> <img src="../../Images/ClockImage.png" />IYUN 19, 2012 BY RASUL GULIYEV - R?SUL QULIYEV</h5> <p style="font-size:14px; font-style:normal;">ACP-nin v? Müqavim?t H?r?katinin lideri, eks-spiker R?sul Quliyev "Yeni Müsavat"a müsahib? verib. O, son vaxtlar ACP-d? bas ver?n kadr d?yisiklikl?ri, bar?sind? dolasan söz-söhb?tl?r v? dig?r m?s?l?l?r? aydinliq g?tirib. Müsahib?ni t?qdim edirik. – Az?rbaycanda siyasi günd?mi ?hat? ed?n m?s?l?l?rd?n biri d? Sülh?ddin ?kb?rin ACP-y? s?dr g?tirilm?sidir. Ideya v? t?s?bbüs kimin idi? – ?vv?ll?r d? qeyd <a href="#"> [...]</a> </p>  </div> <div class="preview" id="latest_story_preview1">  <img src="../../Images/N&EImages/GuliyevFace2.jpeg" style="padding:4px; margin-top:6px; border-style:groove; border-width:thin; margin-left:90px;" /> <a href="#"> <h2 style="font-weight:100; font-style:normal;"> "S?xsiyy?ti Alçaldilan Insanlarin Qisasi Amansiz Olur" </h2></a> <h5 style="font-weight:100; font-size:12px; color:#888; opacity:.9;"> <img src="../../Images/ClockImage.png" />IYUN 12, 2012 BY RASUL GULIYEV - R?SUL QULIYEV</h5> <p style="font-size:14px; font-style:normal;">R?sul Quliyev: "Az?rbaycanda müxalif?tin görün?n f?aliyy?ti ?halinin hökum?td?n naraziliq potensialini ifad? etmir" Eks-spiker Avropa görüsl?rinin yekunlarini s?rh etdi ACP lideri R?sul Quliyevin Avropa görüsl?ri basa çatib. S?f?rin yekunlari bar?d? R?sul Quliyev eksklüziv olaraq "Yeni Müsavat"a açiqlama verib. Norveçd? keçiril?n görüsl?rd? Açiq C?miyy?t v? Liberal Demokrat partiyalarinin s?drl?ri Sülh?ddin ?kb?r, Fuad ?liyev v? Müqavim?t H?r?kati Avropa <a href="#"> [...]</a> </p>  </div> <div class="preview" id="latest_story_preview2">  <img src="../../Images/N&EImages/GuliyevFace3.jpeg" style="padding:4px; margin-top:6px; border-style:groove; border-width:thin; margin-left:90px;" /> <a href="#"> <h2 style="font-weight:100; font-style:normal;"> R?sul Quliyevin Iyunun 4, 2012-ci ild? Bryusseld?ki Görüsl?rl? ?laq?dar Çixisi </h2></a> <h5 style="font-weight:100; font-size:12px; color:#888; opacity:.9;"> <img src="../../Images/ClockImage.png" />IYUN 4, 2012 BY RASUL GULIYEV - R?SUL QULIYEV</h5> <p style="font-size:14px; font-style:normal;">Brüssel görüsl?ri – Az?rbaycanda xalqin malini ogurlayan korrupsioner Höküm?t liderl?rinin xarici banklarda olan qara pullari v? ?mlaklarinin dondurulmasina çox qalmayib. Camaatin hüquqlarini pozan polis, prokuratura v? m?hk?m? isçil?rin? v? onlarin r?hb?rl?rin? viza m?hdudiyy?tl?ri qoymaqda reallasacaq. R?sul Quliyevin Iyunun 4, 2012-ci ild? Bryusseld?ki Görüsl?rl? ?laq?dar Çixisi Rasul Guliyev's Speech on June 4, 2012 about Brussels Meetings <a href="#">[...]</a> </p>  </div> <div class="preview" id="latest_story_preview3">  <img src="../../Images/N&EImages/GuliyevGroup1.jpeg" style="padding:4px; margin-top:6px; border-style:groove; border-width:thin; margin-left:90px;" /> <a href="#"> <h2 style="font-weight:100; font-style:normal;"> R?sul Quliyevin Avropa Parlamentind? v? Hakimiyy?t Qurumlarinda Görüsl?ri Baslamisdir </h2></a> <h5 style="font-weight:100; font-size:12px; color:#888; opacity:.9;"> <img src="../../Images/ClockImage.png" />MAY 31, 2012 BY RASUL GULIYEV - R?SUL QULIYEV</h5> <p style="font-size:14px; font-style:normal;">Aciq C?miyy?t Partiyasinin lideri, eks-spiker R?sul Quliyev Avropa Parlamentind? görüsl?rini davam etdirir. Bu haqda "Yeni Müsavat"a R.Quliyev özü m?lumat verib. O bildirib ki, görüsl?rd? Liberal Demokrat Partiyasinin s?dri Fuad ?liyev v? R.Quliyevin Skandinaviya ölk?l?ri üzr? müsaviri Rauf K?rimov da istirak edirl?r. Eks-spiker deyib ki, bu görüsl?r 2013-cü ild? keçiril?c?k prezident seçkil?rind? saxtalasdirmanin qarsisini almaq planinin [...]</p>  </div> <div class="preview" id="latest_story_preview4">  <img src="../../Images/N&EImages/GuliyevGroup2.jpeg" style="padding:4px; margin-top:6px; border-style:groove; border-width:thin; margin-left:90px;" /> <a href="#"> <h2 style="font-weight:100; font-style:normal;"> Norveçin Oslo S?h?rind? Parlament Üzvl?ri il? v? Xarici Isl?r Nazirliyind? Görüsl?r </h2></a> <h5 style="font-weight:100; font-size:12px; color:#888; opacity:.9;"> <img src="../../Images/ClockImage.png" />MAY 30, 2012 BY RASUL GULIYEV - R?SUL QULIYEV</h5> <p style="font-size:14px; font-style:normal;">R?sul Quliyev Norveçin Oslo s?h?rind? Parlament üzvl?ri v? Xarici isl?r nazirliyind? görüsl?r keçirmisdir. Bu görüsl?rd? Az?rbaycandan Liberal Demokrat Partiyasinin s?dri Fuad ?liyev, Avro-Atlantik Surasinin s?dri Sülh?ddin ?kb?r v? Milli Müqavim?t H?r?katinin Skandinaviya ölk?l?ri üzr? nümay?nd?si Rauf K?rimov istirak etmisdir. Siyasil?r ilk ?vv?l mayin 22-d? Norveç Parlamentinin Avropa Surasinda t?msil ed?n nümay?nd? hey?tinin üzvül?ri Karin S. [...]</a> </p>  </div> <hr /> </div>  <div class="fade" id="article-section"> <h3 style="font-weight:100; font-size:22px; font-style:normal; color:#7C7C7C;">Çecin X?b?rl?r</h3> <div class="older-article"> <img src="../../Images/N&EImages/GuliyevGroup2.jpeg" style="padding:4px; margin-top:6px; border-style:groove; border-width:thin; margin-left:90px;" /> <a href="#"> <h2 style="font-weight:100; font-style:normal;"> Norveçin Oslo S?h?rind? Parlament Üzvl?ri il? v? Xarici Isl?r Nazirliyind? Görüsl?r </h2></a> <h5 style="font-weight:100; font-size:12px; color:#888; opacity:.9;"> <img src="../../Images/ClockImage.png" />MAY 30, 2012 BY RASUL GULIYEV - R?SUL QULIYEV</h5> <p style="font-size:14px; font-style:normal;">R?sul Quliyev Norveçin Oslo s?h?rind? Parlament üzvl?ri v? Xarici isl?r nazirliyind? görüsl?r keçirmisdir. Bu görüsl?rd? Az?rbaycandan Liberal Demokrat Partiyasinin s?dri Fuad ?liyev, Avro-Atlantik Surasinin s?dri Sülh?ddin ?kb?r v? Milli Müqavim?t H?r?katinin Skandinaviya ölk?l?ri üzr? nümay?nd?si Rauf K?rimov istirak etmisdir. Siyasil?r ilk ?vv?l mayin 22-d? Norveç Parlamentinin Avropa Surasinda t?msil ed?n nümay?nd? hey?tinin üzvül?ri Karin S. [...]</a> </p> </div> <hr /> </div>  </font> <h3 class="fade" id="footer">Rasul Guliyev 2012</h3> </div> </body> </head> </html>

Read the article

Wordpress Template HTML CSS Layout Confusion

- by Jess McKenzie

I am having huge confusion with a template that I have purchased and I am trying to modify to handle a widget contact form. I am getting close with this but I have now muddled up the CSS or I have a feeling every page has a different CSS structure. The General Layout: What I Manage To Get: HTML View Source: <div id="innerright"> <div id="home" class="page"> <div id="homeslides"> <div class="welcomeslide"> <h1 class="large">Welcome</h1> </div> </div> </div> <div id="portfolio" class="page"> <div class="verticalline"> <div class="scrollprevnext"></div> </div> <div class="pageheader"> <h3><span>P</span>ortfolio</h3> </div> <div id="portfolioscroller" class="scrollerenabledpage"> <div class="content"> <h5>Recent Work</h5> <ul class="thumb"> <li><a rel="precision_gallery" href="" title=""><img alt="" src="" /></a></li> </ul> </div> </div> </div> <div id="contact" class="page"> <div class="verticalline"> <div class="scrollprevnext"></div> </div> <div class="pageheader"> <h3><span>C</span>ontact</h3> </div> <div id="contactscroller"> <h5>Get In Touch</h5> <div id="contactform">content</div> </div> </div> </div> CSS: CSS index.php: <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title><?php bloginfo('name'); ?></title> <link rel="stylesheet" type="text/css" href="<?php echo get_template_directory_uri(); ?>/style.css" /> <link rel="stylesheet" type="text/css" href="<?php echo get_template_directory_uri(); ?>/fancybox/jquery.fancybox-1.3.4.css" media="screen" /> <?php // jquery will be included by wp_head function as well as scripts and styles by third party plugins wp_head(); ?> <script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/js/plugins.js"></script> <script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/js/script.js"></script> <script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/fancybox/jquery.fancybox-1.3.4.pack.js"></script> <?php // background image if one has been set via options if (function_exists('get_option_tree')) { $background_image = get_option_tree('precision_background_image'); //$background_image = ''; $background_color = get_option_tree('precision_background_color'); if ($background_color != '') { echo '<style>body { background-color:'.$background_color.'; }</style>'; } } ?> <script type="text/javascript"> jQuery(document).ready(function($) { $('.page').each(function(index, element) { $(this).css('left', index * 500); }); <?php // if background is set via the OptionTree then load it first if ($background_image != '') { ?> $.vegas({ src:'<?php echo $background_image; ?>', fade:1000, complete:function() { $("#wrapper").fadeIn(1000); $("#bgpanel").fadeIn(1000); $('#mainslide').crossSlide( { speed: 15, fade: 1 }, [ <?php echo $slides; ?> ] ) $('#homeslides').bxSlider({ mode: 'fade', auto: true, controls:false, speed:1000, pause:5000 }); } }); <?php } else { // if no background has been set then fade-in the page ?> $("#wrapper").fadeIn(1000); $("#bgpanel").fadeIn(1000); $('#mainslide').crossSlide( { speed: 15, fade: 1 }, [ //ENTER YOUR MAIN SLIDESHOW IMAGES HERE\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ <?php echo $slides; ?> ] ) $('#homeslides').bxSlider({ mode: 'fade', auto: true, controls:false, speed:1000, pause:5000 }); <?php } ?> //BX SLIDER INNER PAGE SCROLLERS//////////////////////// $('.scrollerenabledpage').each(function(index, element) { $('#' + $(this).attr('id')).bxSlider({ mode: 'vertical', easing: 'easeInOutQuint', auto: false, controls: true, prevImage:'<?php echo get_template_directory_uri(); ?>/images/up.png', nextImage:'<?php echo get_template_directory_uri(); ?>/images/down.png', infiniteLoop: false, hideControlOnEnd: true, pager: true, pagerType:'short', pagerShortSeparator:'of', speed:800, }); }); //END BX SLIDER INNER PAGE SCROLLERS///////////////// $('#submit').click(function(e) { e.preventDefault(); $('form').submit(); }); // contact form $('form').submit(function(e) { $('#main').append('<img src="<?php echo get_template_directory_uri(); ?>/images/loader.gif" class="loaderIcon" alt="Loading..." />'); $.post("<?php bloginfo('wpurl'); ?>/wp-admin/admin-ajax.php", {action:'precision_contact_form_handler', uname:$('input#uname').val(), uemail:$('input#uemail').val(), ucomments:$('textarea#ucomments').val()}, function(data) { $('#main img.loaderIcon').fadeOut(1000); if (data.status == "success") { $('#response').html("Forum has been successfully submitted."); } else { if (data.response != '') { $('#response').html(data.response); } else { $('#response').html("An error occurred while submitting the form. Please try again."); } } }, "json"); return false; }); }); //hides contact form labels when a field gets focus function initOverLabels () { if (!document.getElementById) return; var labels, id, field; labels = document.getElementsByTagName('label'); for (var i = 0; i < labels.length; i++) { if (labels[i].className == 'overlabel') { id = labels[i].htmlFor || labels[i].getAttribute('for'); if (!id || !(field = document.getElementById(id))) { continue; } labels[i].className = 'overlabel-apply'; if (field.value !== '') { hideLabel(field.getAttribute('id'), true); } field.onfocus = function () { hideLabel(this.getAttribute('id'), true); }; field.onblur = function () { if (this.value === '') { hideLabel(this.getAttribute('id'), false); } }; labels[i].onclick = function () { var id, field; id = this.getAttribute('for'); if (id && (field = document.getElementById(id))) { field.focus(); } }; } } }; function hideLabel(field_id, hide) { var field_for; var labels = document.getElementsByTagName('label'); for (var i = 0; i < labels.length; i++) { field_for = labels[i].htmlFor || labels[i].getAttribute('for'); if (field_for == field_id) { labels[i].style.textIndent = (hide) ? '-1000px' : '0px'; return true; } } } window.onload = function () { setTimeout(initOverLabels, 50); }; </script> <?php if (function_exists('get_option_tree')) { $precision_font_family_1 = get_option_tree('precision_font_family_1'); ?> <link href='http://fonts.googleapis.com/css?family=<?php echo $precision_font_family_1; ?>' rel='stylesheet' type='text/css'> <?php } ?> <style> h1, h2 { font-family:<?php echo $precision_font_family_1; ?>; } </style> </head> <body> <div id="wrapper"> <div id="innerleft"> <div id="header"> <?php if (function_exists('get_option_tree')) { $site_logo = get_option_tree('precision_site_logo'); ?> <a href="/" title="<?php bloginfo('name');?>"><img src="<?php echo $site_logo; ?>" alt="<?php bloginfo('name');?>" /></a> <?php } ?> </div> <?php if (function_exists('get_option_tree')) { $precision_slideshow_image = get_option_tree('precision_slideshow_image'); } ?> <ul id="nav"> <?php //instead of using wp_nav_menu, we use wp_get_nav_menu_items so that we can store the data in array and re-use it again //wp_nav_menu(array('theme_location' => 'precision-main-menu', 'container' => 'false')); $slt_menuItems = wp_get_nav_menu_items( "precision-main-menu" ); $menusItems = array(); foreach ($slt_menuItems as $slt_menuItem) { $page_title = $slt_menuItem->title; $menuItem = new stdClass; $menuItem->title = $page_title; $menuItem->page_id = $slt_menuItem->object_id; $menusItems[] = $menuItem; ?> <li id="<?php echo strtolower($page_title); ?>nav"><a href="#<?php echo strtolower($page_title); ?>"><?php echo $page_title; ?></a></li> <?php } ?> </ul> <div id="socialMedia"> <ul class="social"> <?php if (function_exists('get_option_tree')) { $twitter_link = get_option_tree('precision_twitter_link'); $facebook_link = get_option_tree('precision_facebook_link'); $gplus_link = get_option_tree('precision_gplus_link'); $delicious_link = get_option_tree('precision_delicious_link'); $flickr_link = get_option_tree('precision_flickr_link'); $vimeo_link = get_option_tree('precision_vimeo_link'); $youtube_link = get_option_tree('precision_youtube_link'); $linkedin_link = get_option_tree('precision_linkedin_link'); ?>  <?php if($linkedin_link != ''){ ?> <li><a href="<?php echo $linkedin_link;?>" title="Follow <?php bloginfo('name'); ?> on Linkedin"><img src="<?php echo get_template_directory_uri();?>/images/social-icons/linkedin.png" width="49" height="64" alt="<?php bloginfo('name'); ?> Linkedin"/></a><li> <?php } ?>   <?php if ($twitter_link != '') { ?> <li><a href="<?php echo $twitter_link; ?>" title="Follow <?php bloginfo('name'); ?> on Twitter"><img src="<?php echo get_template_directory_uri(); ?>/images/social-icons/twitter.png" width="49" height="64" alt="<?php bloginfo('name'); ?> Twitter" /></a></li> <?php } ?>   <?php if ($facebook_link != '') { ?> <li><a href="<?php echo $facebook_link; ?>" title="Follow <?php bloginfo('name'); ?> on Facebook"><img src="<?php echo get_template_directory_uri(); ?>/images/social-icons/facebook.png" width="49" height="64" alt="<?php bloginfo('name'); ?> Facebook" /></a></li> <?php } ?>   <?php if ($gplus_link != '') { ?> <li><a href="<?php echo $gplus_link; ?>"><img src="<?php echo get_template_directory_uri(); ?>/images/social-icons/google_plus.png" width="16" height="16" alt="google+" /></a></li> <?php } ?>   <?php if ($delicious_link != '') { ?> <li><a href="<?php echo $delicious_link; ?>"><img src="<?php echo get_template_directory_uri(); ?>/images/social-icons/delicious.png" width="16" height="16" alt="delicious" /></a></li> <?php } ?>   <?php if ($flickr_link != '') { ?> <li><a href="<?php echo $flickr_link; ?>"><img src="<?php echo get_template_directory_uri(); ?>/images/social-icons/flickr.png" width="16" height="16" alt="flickr" /></a></li> <?php } ?>   <?php if ($vimeo_link != '') { ?> <li><a href="<?php echo $vimeo_link; ?>"><img src="<?php echo get_template_directory_uri(); ?>/images/social-icons/vimeo.png" width="16" height="16" alt="vimeo" /></a></li> <?php } ?>   <?php if ($youtube_link != '') { ?> <li><a href="<?php echo $youtube_link; ?>"><img src="<?php echo get_template_directory_uri(); ?>/images/social-icons/youtube.png" width="16" height="16" alt="youtube" /></a></li> <?php } ?>  <?php } ?> </ul> </div> </div> <div id="innerright"> <?php if (function_exists('get_option_tree')) { $precision_home_page_option = get_option_tree('precision_home_page'); $precision_home_page = strtolower(get_the_title($precision_home_page_option)); if ($precision_home_page == '') { $precision_home_page = 'home'; } $precision_contact_page_option = get_option_tree('precision_contact_page'); $precision_contact_page = strtolower(get_the_title($precision_contact_page_option)); if ($precision_contact_page == '') { $precision_contact_page = 'contact'; } } foreach ($menusItems as $menuItem) { ?> <div id="<?php echo strtolower($menuItem->title); ?>" class="page"> <?php if (strtolower($menuItem->title) == $precision_home_page) { ?> <div id="homeslides"> <?php $page_data = get_page($menuItem->page_id); $content = apply_filters('the_content', $page_data->post_content); echo $content; ?> </div> <?php } else { ?> <div class="verticalline"> <div class="scrollprevnext"></div> </div> <div class="pageheader"> <h3><span><?php echo substr($menuItem->title, 0, 1); ?></span><?php echo substr($menuItem->title, 1); ?></h3> </div> <?php $classes = ''; if (strtolower($menuItem->title) == $precision_contact_page) { ?> <div id="<?php echo strtolower($menuItem->title); ?>scroller"> <?php $page_data = get_page($menuItem->page_id); $content = apply_filters('the_content', $page_data->post_content); echo $content; ?> </div> <?php } else { $classes = 'scrollerenabledpage'; ?> <div id="<?php echo strtolower($menuItem->title); ?>scroller" class="<?php echo $classes; ?>"> <?php $page_data = get_page($menuItem->page_id); $content = apply_filters('the_content', $page_data->post_content); echo $content; ?> </div> <?php } } ?> </div> <?php } ?> </div> <div id="footer"> <p>© <a href="/"><?php bloginfo('name');?></a> | <?php echo date('Y');?></p> </div> </div> </div>  </body> </html>

Read the article

403 error after adding javascript to masterpage for sharepoint.

- by Jeremy

I am attempting to add highslide-with-html.js from http://highslide.com/ to my masterpage. I am receiving a 403 forbidden error when I use the provided masterpage. I have placed it in C:\Program Files\Common Files\Microsoft Shared\web server extensions\12\TEMPLATE\LAYOUTS\1033. Test javascript files such as pirate.js which consists solely of alert("Arr!"); have loaded from the same directory. I have provided the code for the masterpage. When I do not reference the problem javascript file there is no 403 error. <%@ Master language="C#" %> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <%@ Import Namespace="Microsoft.SharePoint" %> <%@ Register Tagprefix="SPSWC" Namespace="Microsoft.SharePoint.Portal.WebControls" Assembly="Microsoft.SharePoint.Portal, Version=12.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> <%@ Register Tagprefix="SharePoint" Namespace="Microsoft.SharePoint.WebControls" Assembly="Microsoft.SharePoint, Version=12.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> <%@ Register Tagprefix="WebPartPages" Namespace="Microsoft.SharePoint.WebPartPages" Assembly="Microsoft.SharePoint, Version=12.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> <%@ Register Tagprefix="PublishingWebControls" Namespace="Microsoft.SharePoint.Publishing.WebControls" Assembly="Microsoft.SharePoint.Publishing, Version=12.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> <%@ Register Tagprefix="PublishingNavigation" Namespace="Microsoft.SharePoint.Publishing.Navigation" Assembly="Microsoft.SharePoint.Publishing, Version=12.0.0.0, Culture=neutral, PublicKeyToken=71e9bce111e9429c" %> <%@ Register TagPrefix="wssuc" TagName="Welcome" src="~/_controltemplates/Welcome.ascx" %> <%@ Register TagPrefix="wssuc" TagName="DesignModeConsole" src="~/_controltemplates/DesignModeConsole.ascx" %> <%@ Register TagPrefix="PublishingVariations" TagName="VariationsLabelMenu" src="~/_controltemplates/VariationsLabelMenu.ascx" %> <%@ Register Tagprefix="PublishingConsole" TagName="Console" src="~/_controltemplates/PublishingConsole.ascx" %> <%@ Register TagPrefix="PublishingSiteAction" TagName="SiteActionMenu" src="~/_controltemplates/PublishingActionMenu.ascx" %> <html dir="<%$Resources:wss, multipages_direction_dir_value %>" runat="server" __expr-val-dir="ltr"> <head runat="server"> <meta name="GENERATOR" content="Microsoft SharePoint"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta http-equiv="Expires" content="0"> <SharePoint:RobotsMetaTag runat="server" __designer:Preview="" __designer:Values="<P N='InDesign' T='False' /><P N='ID' T='ctl00' /><P N='Page' ID='1' /><P N='TemplateControl' ID='2' /><P N='AppRelativeTemplateSourceDirectory' R='-1' />"/> <title id="onetidTitle"> <asp:ContentPlaceHolder id="PlaceHolderPageTitle" runat="server"/> </title> <Sharepoint:CssLink runat="server" __designer:Preview="<link rel="stylesheet" type="text/css" href="/Style%20Library/en-US/Core%20Styles/Band.css"/> <link rel="stylesheet" type="text/css" href="/Style%20Library/en-US/Core%20Styles/controls.css"/> <link rel="stylesheet" type="text/css" href="/Style%20Library/zz1_blue.css"/> <link rel="stylesheet" type="text/css" href="/_layouts/1033/styles/core.css"/> " __designer:Values="<P N='InDesign' T='False' /><P N='ID' T='ctl01' /><P N='Page' ID='1' /><P N='TemplateControl' ID='2' /><P N='AppRelativeTemplateSourceDirectory' R='-1' />"/>  <SharePoint:CssRegistration name="<% $SPUrl:~SiteCollection/Style Library/~language/Core Styles/Band.css%>" runat="server" __designer:Preview="<link rel="stylesheet" type="text/css" href="/Style%20Library/en-US/Core%20Styles/Band.css"/> " __designer:Values="<P N='Name' Bound='True' T='SPUrl:~SiteCollection/Style Library/~language/Core Styles/Band.css' /><P N='InDesign' T='False' /><P N='ID' T='ctl02' /><P N='Page' ID='1' /><P N='TemplateControl' ID='2' /><P N='AppRelativeTemplateSourceDirectory' R='-1' />"/> <SharePoint:CssRegistration name="<% $SPUrl:~sitecollection/Style Library/~language/Core Styles/controls.css %>" runat="server" __designer:Preview="<link rel="stylesheet" type="text/css" href="/Style%20Library/en-US/Core%20Styles/controls.css"/> " __designer:Values="<P N='Name' Bound='True' T='SPUrl:~sitecollection/Style Library/~language/Core Styles/controls.css' /><P N='InDesign' T='False' /><P N='ID' T='ctl03' /><P N='Page' ID='1' /><P N='TemplateControl' ID='2' /><P N='AppRelativeTemplateSourceDirectory' R='-1' />"/> <SharePoint:CssRegistration name="<% $SPUrl:~SiteCollection/Style Library/zz1_blue.css%>" runat="server" __designer:Preview="<link rel="stylesheet" type="text/css" href="/Style%20Library/zz1_blue.css"/> " __designer:Values="<P N='Name' Bound='True' T='SPUrl:~SiteCollection/Style Library/zz1_blue.css' /><P N='InDesign' T='False' /><P N='ID' T='ctl04' /><P N='Page' ID='1' /><P N='TemplateControl' ID='2' /><P N='AppRelativeTemplateSourceDirectory' R='-1' />"/> <SharePoint:ScriptLink name="init.js" runat="server" __designer:Preview="<script src="/_layouts/1033/init.js?rev=VhAxGc3rkK79RM90tibDzw%3D%3D"></script> " __designer:Values="<P N='Name' T='init.js' /><P N='InDesign' T='False' /><P N='ID' T='ctl05' /><P N='Page' ID='1' /><P N='TemplateControl' ID='2' /><P N='AppRelativeTemplateSourceDirectory' R='-1' />"/> <SharePoint:ScriptLink Name="highslide-with-html.js" runat="server" __designer:Error="Access to the path 'C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\12\Template\layouts\1033\highslide-with-html.js' is denied."/>  <asp:ContentPlaceHolder id="PlaceHolderAdditionalPageHead" runat="server"/> </head> <body class="body" onload="javascript:_spBodyOnLoadWrapper();"> <WebPartPages:SPWebPartManager runat="server"/> <form runat="server" onsubmit="return _spFormOnSubmitWrapper();"> <table cellpadding="0" cellspacing="0" class="master"> <tr> <td height="100%" class="shadowLeft"> <div class="spacer"> </div> </td> <td valign="top"> <table cellpadding="0" cellspacing="0" width="100%" class="masterContent"> <tr style="height:0px"><td> <wssuc:DesignModeConsole id="IdDesignModeConsole" runat="server" __designer:Preview="<span __designer:NonVisual="true">[ DesignModeConsoleContainer "DesignModeContainer" ]</span> " __designer:Values="<P N='ID' ID='1' T='IdDesignModeConsole' /><P N='TemplateControl' R='0' />"/></td></tr> <tr> <td colspan="2" class="authoringRegion"> <span class="siteActionMenu"> <PublishingSiteAction:SiteActionMenu runat="server" __designer:Preview="  <table height=100% class="ms-siteaction" cellpadding=0 cellspacing=0> <tr> <td class="ms-siteactionsmenu" id="siteactiontd"> <span style="display:none"><menu type='ServerMenu' id="zz1_SiteActionsMenuMain" largeIconMode="true"><ie:menuitem id="zz2_MenuItem_Create" type="option" iconSrc="/_layouts/images/Actionscreate.gif" onMenuClick="window.location = '/_layouts/create.aspx';" menuGroupId="100"></ie:menuitem><ie:menuitem id="zz3_MenuItem_Settings" type="option" iconSrc="/_layouts/images/ActionsSettings.gif" onMenuClick="window.location = '/_layouts/settings.aspx';" menuGroupId="100"></ie:menuitem></menu></span><div><div><span title="Open Menu"><div id="zz4_SiteActionsMenu_t" class="" onmouseover="MMU_PopMenuIfShowing(this);MMU_EcbTableMouseOverOut(this, true)" hoverActive="ms-siteactionsmenuhover" hoverInactive="" onclick=" MMU_Open(byid(''), MMU_GetMenuFromClientId('zz4_SiteActionsMenu'),event,false, null, 0);" foa="MMU_GetMenuFromClientId('zz4_SiteActionsMenu')" oncontextmenu="this.click(); return false;" nowrap="nowrap"><a id="zz4_SiteActionsMenu" accesskey="/" href="#" onclick="javascript:return false;" style="cursor:pointer;white-space:nowrap;" onfocus="MMU_EcbLinkOnFocusBlur(byid(''), this, true);" onkeydown="MMU_EcbLinkOnKeyDown(byid(''), MMU_GetMenuFromClientId('zz4_SiteActionsMenu'), event);" onclick=" MMU_Open(byid(''), MMU_GetMenuFromClientId('zz4_SiteActionsMenu'),event,false, null, 0);" oncontextmenu="this.click(); return false;" menuTokenValues="MENUCLIENTID=zz4_SiteActionsMenu,TEMPLATECLIENTID=zz1_SiteActionsMenuMain" serverclientid="zz4_SiteActionsMenu">Site Actions<img src="/_layouts/images/blank.gif" border="0" alt="Use SHIFT+ENTER to open the menu (new window)."/></a><img align="absbottom" src="/_layouts/images/whitearrow.gif" alt="" /></div></span></div></div> </td> </tr> </table>  " __designer:Values="<P N='TemplateControl' R='0' />"/> </span> <div class="sharepointLogin">  <table cellpadding="0" cellspacing="0" > <tr> <td class="ms-globallinks"> <SharePoint:DelegateControl ControlId="GlobalSiteLink1" Scope="Farm" runat="server" __designer:Preview="<span style='padding-left:3px'></span> <a id="ctl00_ctl09_hlMySite" href="http://litwaredemo:80/MySite/_layouts/MySite.aspx">My Site</a> <span style='padding-left:4px;padding-right:3px'>|</span> " __designer:Values="<P N='ControlId' T='GlobalSiteLink1' /><P N='Scope' T='Farm' /><P N='ID' T='ctl08' /><P N='Page' ID='1' /><P N='TemplateControl' ID='2' /><P N='AppRelativeTemplateSourceDirectory' R='-1' />"/></td> <td class="ms-globallinks"> <SharePoint:DelegateControl ControlId="GlobalSiteLink2" Scope="Farm" runat="server" __designer:Preview="<span id="ctl00_ctl11_MyLinksMenu"><span style="display:none"><menu type='ServerMenu' id="ctl00_ctl11_MyLinksMenuMenuTemplate" largeIconMode="true"></menu></span><span title="Open Menu"><span id="ctl00_ctl11_MyLinksMenuMenu_t" class="ms-SPLink ms-hovercellinactive" onmouseover="MMU_PopMenuIfShowing(this);MMU_EcbTableMouseOverOut(this, true)" hoverActive="ms-SPLink ms-hovercellactive" hoverInactive="ms-SPLink ms-hovercellinactive" onclick="javascript:FetchCallbackMenuItems(&#39;ctl00_ctl11_MyLinksMenuMenuTemplate&#39;); MMU_Open(byid('ctl00_ctl11_MyLinksMenuMenuTemplate'), MMU_GetMenuFromClientId('ctl00_ctl11_MyLinksMenuMenu'),event,true, null, 0);" foa="MMU_GetMenuFromClientId('ctl00_ctl11_MyLinksMenuMenu')" oncontextmenu="this.click(); return false;" nowrap="nowrap"><a id="ctl00_ctl11_MyLinksMenuMenu" accesskey="M" href="#" onclick="javascript:return false;" style="cursor:pointer;white-space:nowrap;" onfocus="MMU_EcbLinkOnFocusBlur(byid('ctl00_ctl11_MyLinksMenuMenuTemplate'), this, true);" onkeydown="MMU_EcbLinkOnKeyDown(byid('ctl00_ctl11_MyLinksMenuMenuTemplate'), MMU_GetMenuFromClientId('ctl00_ctl11_MyLinksMenuMenu'), event);" onclick="javascript:FetchCallbackMenuItems(&#39;ctl00_ctl11_MyLinksMenuMenuTemplate&#39;); MMU_Open(byid('ctl00_ctl11_MyLinksMenuMenuTemplate'), MMU_GetMenuFromClientId('ctl00_ctl11_MyLinksMenuMenu'),event,true, null, 0);" oncontextmenu="this.click(); return false;" menuTokenValues="MENUCLIENTID=ctl00_ctl11_MyLinksMenuMenu,TEMPLATECLIENTID=ctl00_ctl11_MyLinksMenuMenuTemplate" serverclientid="ctl00_ctl11_MyLinksMenuMenu">My Links<img src="/_layouts/images/blank.gif" border="0" alt="Use SHIFT+ENTER to open the menu (new window)."/></a><img align="absbottom" src="/_layouts/images/menudark.gif" alt="" /></span></span></span>|" __designer:Values="<P N='ControlId' T='GlobalSiteLink2' /><P N='Scope' T='Farm' /><P N='ID' T='ctl10' /><P N='Page' ID='1' /><P N='TemplateControl' ID='2' /><P N='AppRelativeTemplateSourceDirectory' R='-1' />"/></td> <td class="ms-globallinks"> <wssuc:Welcome id="explitLogout" runat="server" __designer:Preview=" <span style="display:none"><menu type='ServerMenu' id="zz5_ID_PersonalActionMenu" largeIconMode="true"><ie:menuitem id="zz6_ID_PersonalInformation" type="option" iconSrc="/_layouts/images/menuprofile.gif" onMenuClick="javascript:GoToPage('\u002f_layouts\u002fuserdisp.aspx?Force=True\u0026ID=' + _spUserId);return false;" menuGroupId="100"></ie:menuitem><ie:menuitem id="zz7_ID_LoginAsDifferentUser" type="option" onMenuClick="javascript:LoginAsAnother('\u002f_layouts\u002fAccessDenied.aspx?loginasanotheruser=true', 0)" menuGroupId="200"></ie:menuitem><ie:menuitem id="zz8_ID_RequestAccess" type="option" onMenuClick="window.location = '/_layouts/reqacc.aspx?type=list&amp;name=%7B36F0105B%2D0F8E%2D4A22%2DBE90%2D716A51E97B5D%7D';" menuGroupId="200"></ie:menuitem><ie:menuitem id="zz9_ID_Logout" type="option" onMenuClick="window.location = '/_layouts/SignOut.aspx';" menuGroupId="200"></ie:menuitem></menu></span><span title="Open Menu"><div id="zz10_Menu_t" class="ms-SPLink ms-SpLinkButtonInActive" onmouseover="MMU_PopMenuIfShowing(this);MMU_EcbTableMouseOverOut(this, true)" hoverActive="ms-SPLink ms-SpLinkButtonActive" hoverInactive="ms-SPLink ms-SpLinkButtonInActive" onclick=" MMU_Open(byid(''), MMU_GetMenuFromClientId('zz10_Menu'),event,false, null, 0);" foa="MMU_GetMenuFromClientId('zz10_Menu')" oncontextmenu="this.click(); return false;" nowrap="nowrap"><a id="zz10_Menu" accesskey="L" href="#" onclick="javascript:return false;" style="cursor:pointer;white-space:nowrap;" onfocus="MMU_EcbLinkOnFocusBlur(byid(''), this, true);" onkeydown="MMU_EcbLinkOnKeyDown(byid(''), MMU_GetMenuFromClientId('zz10_Menu'), event);" onclick=" MMU_Open(byid(''), MMU_GetMenuFromClientId('zz10_Menu'),event,false, null, 0);" oncontextmenu="this.click(); return false;" menuTokenValues="MENUCLIENTID=zz10_Menu,TEMPLATECLIENTID=zz5_ID_PersonalActionMenu" serverclientid="zz10_Menu">Welcome LitwareInc Administrator<img src="/_layouts/images/blank.gif" border="0" alt="Use SHIFT+ENTER to open the menu (new window)."/></a><img align="absbottom" src="/_layouts/images/menudark.gif" alt="" /></div></span><script type="text/javascript" language="javascript">var _spUserId=1;</script> <a id="explitLogout_ExplicitLogin" Href="_controltemplates/http://litwaredemo/_layouts/Authenticate.aspx" style="display:none">Sign In</a> " __designer:Values="<P N='ID' ID='1' T='explitLogout' /><P N='TemplateControl' R='0' />"/></td> </tr> </table> </div> <div class="console"> <PublishingConsole:Console runat="server" __designer:Preview="  <span id="ctl00_publishingContext1"></span> <script type="text/javascript" language="javascript">if (document.getElementById('mpdmconsole')) { ShowConsoleBlockPaddingWithOverhang('mpLeftBackPadding', 'mpRightBackPadding', 'masterPageLeftOverhang', 'masterPageRightOverhang'); } </script>  " __designer:Values="<P N='TemplateControl' R='0' />"/> </div> </td> </tr> <tr> <td colspan="2" > <table cellpadding="0" cellspacing="0" width="100%"> <tr> <td colspan="4" class="topArea"> <SharePoint:AspMenu ID="logoLinkId" runat="server" DataSourceID="SiteMapDataSourceRoot" StaticDisplayLevels="1" MaximumDynamicDisplayLevels="0" AccessKey="1" CssClass="logo" __designer:Preview="<table id="zz12_logoLinkId" class="logo" cellpadding="0" cellspacing="0" border="0"> <tr id="zz12_logoLinkIdn0"> <td><table cellpadding="0" cellspacing="0" border="0" width="100%"> <tr> <td style="white-space:nowrap;width:100%;"><a Href="/Pages/Default.aspx" accesskey="1" style="text-decoration:none;">Home</a></td> </tr> </table></td> </tr> </table>" __designer:Values="<P N='ID' T='logoLinkId' /><P N='MaximumDynamicDisplayLevels' T='0' /><P N='DataSourceID' T='SiteMapDataSourceRoot' /><P N='AccessKey' T='1' /><P N='ControlStyle'><P N='CssClass' ID='1' T='logo' /><P N='Font' ID='2' /><P N='IsEmpty' T='False' /></P><P N='CssClass' R='1' /><P N='Font' R='2' /><P N='Page' ID='3' /><P N='TemplateControl' ID='4' /><P N='AppRelativeTemplateSourceDirectory' R='-1' />" __designer:Templates="<Group Name="Item Templates"><Template Name="StaticItemTemplate" Flags="D" Content="" /><Template Name="DynamicItemTemplate" Flags="D" Content="" /></Group>"/> <PublishingNavigation:PortalSiteMapDataSource ID="SiteMapDataSourceRoot" Runat="server" SiteMapProvider="CombinedNavSiteMapProvider" EnableViewState="true" StartFromCurrentNode="true" StartingNodeOffset="0" ShowStartingNode="true" __designer:Preview="<table cellpadding=4 cellspacing=0 style="font:messagebox;color:buttontext;background-color:buttonface;border: solid 1px;border-top-color:buttonhighlight;border-left-color:buttonhighlight;border-bottom-color:buttonshadow;border-right-color:buttonshadow"> <tr><td nowrap><span style="font-weight:bold">PortalSiteMapDataSource</span> - SiteMapDataSourceRoot</td></tr> <tr><td></td></tr> </table>" __designer:Values="<P N='ID' T='SiteMapDataSourceRoot' /><P N='SiteMapProvider' T='CombinedNavSiteMapProvider' /><P N='StartFromCurrentNode' T='True' /><P N='Page' ID='1' /><P N='TemplateControl' ID='2' /><P N='AppRelativeTemplateSourceDirectory' R='-1' />"/> <div class="topLinkBar"> <div class="topLink"> <PublishingVariations:VariationsLabelMenu id="labelmenu1" runat="server" __designer:Preview="<span __designer:NonVisual="true"><table cellpadding=4 cellspacing=0 style="font:messagebox;color:buttontext;background-color:buttonface;border: solid 1px;border-top-color:buttonhighlight;border-left-color:buttonhighlight;border-bottom-color:buttonshadow;border-right-color:buttonshadow"> <tr><td nowrap><span style="font-weight:bold">VariationDataSource</span> - LabelMenuDataSource</td></tr> <tr><td></td></tr> </table></span> " __designer:Values="<P N='ID' ID='1' T='labelmenu1' /><P N='TemplateControl' R='0' />"/> </div> </div> </td> </tr> <tr class="topNavContainer"> <td class="topNavRoundLeft"> <div class="glassSpacerLeft" /> </td> <td valign="top" width="100%"> <SharePoint:AspMenu ID="GlobalNav" Runat="server" DataSourceID="SiteMapDataSource1" Orientation="Horizontal" StaticDisplayLevels="1" MaximumDynamicDisplayLevels="1" StaticSubMenuIndent="0" DynamicHorizontalOffset="0" DynamicVerticalOffset="-8" StaticEnableDefaultPopOutImage="false" ItemWrap="false" SkipLinkText="<%$Resources:cms,masterpages_skiplinktext%>" CssClass="topNav" __designer:Preview="<table id="zz13_GlobalNav" class="topNav" cellpadding="0" cellspacing="0" border="0"> <tr> <td title="Document Center site" id="zz13_GlobalNavn0"><table class="topNavItem" cellpadding="0" cellspacing="0" border="0" width="100%"> <tr> <td style="white-space:nowrap;"><a class="topNavItem" Href="/Docs" style="text-decoration:none;border-style:none;">Document Center</a></td> </tr> </table></td><td style="width:0px;"></td><td style="width:0px;"></td><td title="Company News Home" id="zz13_GlobalNavn1"><table class="topNavItem" cellpadding="0" cellspacing="0" border="0" width="100%"> <tr> <td style="white-space:nowrap;"><a class="topNavItem" Href="/News/Pages/Default.aspx" style="text-decoration:none;border-style:none;">News</a></td> </tr> </table></td><td style="width:0px;"></td><td style="width:0px;"></td><td title="Report Center" id="zz13_GlobalNavn2"><table class="topNavItem" cellpadding="0" cellspacing="0" border="0" width="100%"> <tr> <td style="white-space:nowrap;"><a class="topNavItem" Href="/Reports/Pages/Default.aspx" style="text-decoration:none;border-style:none;">Reports</a></td> </tr> </table></td><td style="width:0px;"></td><td style="width:0px;"></td><td title="The Search Center displays search results" id="zz13_GlobalNavn3"><table class="topNavItem" cellpadding="0" cellspacing="0" border="0" width="100%"> <tr> <td style="white-space:nowrap;"><a class="topNavItem" Href="/SearchCenter/Pages/default.aspx" style="text-decoration:none;border-style:none;">Search</a></td> </tr> </table></td><td style="width:0px;"></td><td style="width:0px;"></td><td title="Site Directory web" id="zz13_GlobalNavn4"><table class="topNavItem" cellpadding="0" cellspacing="0" border="0" width="100%"> <tr> <td style="white-space:nowrap;"><a class="topNavItem" Href="/SiteDirectory/Pages/category.aspx" style="text-decoration:none;border-style:none;">Sites</a></td> </tr> </table></td><td style="width:0px;"></td> </tr> </table>" __designer:Values="<P N='ID' T='GlobalNav' /><P N='DynamicHoverStyle'><P N='CssClass' T='topNavFlyOutsHover' /><P N='IsEmpty' T='False' /></P><P N='DynamicMenuItemStyle'><P N='CssClass' T='topNavFlyOutsItem' /><P N='IsEmpty' T='False' /></P><P N='DynamicMenuStyle'><P N='CssClass' T='topNavFlyOuts' /><P N='IsEmpty' T='False' /></P><P N='DynamicVerticalOffset' T='-8' /><P N='MaximumDynamicDisplayLevels' T='1' /><P N='Orientation' E='0' /><P N='SkipLinkText' Bound='True' T='Resources:cms,masterpages_skiplinktext' /><P N='StaticEnableDefaultPopOutImage' T='False' /><P N='StaticHoverStyle'><P N='CssClass' T='topNavHover' /><P N='IsEmpty' T='False' /></P><P N='StaticMenuItemStyle'><P N='CssClass' T='topNavItem' /><P N='ItemSpacing' T='0px' /><P N='IsEmpty' T='False' /></P><P N='StaticSelectedStyle'><P N='CssClass' T='topNavSelected' /><P N='ItemSpacing' T='0px' /><P N='IsEmpty' T='False' /></P><P N='StaticSubMenuIndent' T='0px' /><P N='DataSourceID' T='SiteMapDataSource1' /><P N='ControlStyle'><P N='CssClass' ID='1' T='topNav' /><P N='Font' ID='2' /><P N='IsEmpty' T='False' /></P><P N='CssClass' R='1' /><P N='Font' R='2' /><P N='Page' ID='3' /><P N='TemplateControl' ID='4' /><P N='AppRelativeTemplateSourceDirectory' R='-1' />" __designer:Templates="<Group Name="Item Templates"><Template Name="StaticItemTemplate" Flags="D" Content="" /><Template Name="DynamicItemTemplate" Flags="D" Content="" /></Group>"> <StaticMenuItemStyle CssClass="topNavItem" ItemSpacing="0"/> <StaticSelectedStyle CssClass="topNavSelected" ItemSpacing="0"/> <StaticHoverStyle CssClass="topNavHover"/> <DynamicMenuStyle CssClass="topNavFlyOuts" /> <DynamicMenuItemStyle CssClass="topNavFlyOutsItem" /> <DynamicHoverStyle CssClass="topNavFlyOutsHover"/> </SharePoint:AspMenu> <PublishingNavigation:PortalSiteMapDataSource ID="siteMapDataSource1" Runat="server" SiteMapProvider="CombinedNavSiteMapProvider" EnableViewState="true" StartFromCurrentNode="true" StartingNodeOffset="0" ShowStartingNode="false" TreatStartingNodeAsCurrent="true" TrimNonCurrentTypes="Heading" __designer:Preview="<table cellpadding=4 cellspacing=0 style="font:messagebox;color:buttontext;background-color:buttonface;border: solid 1px;border-top-color:buttonhighlight;border-left-color:buttonhighlight;border-bottom-color:buttonshadow;border-right-color:buttonshadow"> <tr><td nowrap><span style="font-weight:bold">PortalSiteMapDataSource</span> - siteMapDataSource1</td></tr> <tr><td></td></tr> </table>" __designer:Values="<P N='ID' T='siteMapDataSource1' /><P N='SiteMapProvider' T='CombinedNavSiteMapProvider' /><P N='StartFromCurrentNode' T='True' /><P N='ShowStartingNode' T='False' /><P N='TreatStartingNodeAsCurrent' T='True' /><P N='TrimNonCurrentTypes' E='32' /><P N='Page' ID='1' /><P N='TemplateControl' ID='2' /><P N='AppRelativeTemplateSourceDirectory' R='-1' />"/> </td> <td> <div class="search"> <asp:ContentPlaceHolder id="PlaceHolderSearchArea" runat="server"> <SPSWC:SearchBoxEx id="SearchBox" RegisterStyles="false" TextBeforeDropDown="" TextBeforeTextBox="<%$Resources:cms,masterpages_searchbox_label%>" TextBoxWidth="100" GoImageUrl="<% $SPUrl:~sitecollection/Style Library/Images/Search_Arrow.jpg %>" GoImageUrlRTL="<% $SPUrl:~sitecollection/Style Library/Images/Search_Arrow_RTL.jpg %>" UseSiteDefaults="true" DropDownMode = "HideScopeDD" SuppressWebPartChrome="true" runat="server" WebPart="true" __WebPartId="{7DECDCCA-FDA0-4739-8F0E-7B8DE48F0E0D}" __Preview="<table TOPLEVEL border="0" cellpadding="0" cellspacing="0" width="100%"> <tr> <td><table border="0" cellpadding="0" cellspacing="0" width="100%"> <tr class="ms-WPHeader"> <td title="" id="WebPart

Read the article

Debugging HTML & JavaScript with Firebug

- by MattDiPasquale

I made a JSONP widget. However, when one of the partner sites put it in their page, (1) it doesn't render at all in IE and (2) in other browsers (Firefox & Google Chrome), the HTML of the widget renders incorrectly: the <aside> closes prematurely, before the Financial Aid Glossary. It's something specific to that page because it works fine on this example college resource center page. To fix these two issues, I tried saving the page source to a local file and messing around with the local file and with Firebug, deleting DOM elements and stuff. I even tried fixing the errors that The W3C Markup Validation Service found. But, I still couldn't get it to render correctly. How should I tell them to change their page so that the widget renders correctly? Or, how should I update the widget script I wrote? They may take their page down since it's not rendering correctly, so here's the source of the page just in case: <!DOCTYPE html> <html> <head id="ctl01_Head1" profile="New Jersey Credit Union League"><title> College Resource Center - New Jersey Credit Union League </title> <link rel='stylesheet' type='text/css' href='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/themes/base/jquery.ui.all.css' /> <link rel='stylesheet' type='text/css' href='/csshandler.ashx?skin=InnerTemplate&s=1&v=2.3.5.8' />    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link rel="search" type="application/opensearchdescription+xml" title="New Jersey Credit Union League" href="http://njcul.org/SearchEngineInfo.ashx" />  <meta name="viewport" content="width=670, initial-scale=0.45, minimum-scale=0.45" /> <link rel='shortcut icon' href='http://njcul.org/Data/Sites/1/skins/InnerTemplate/favicon.ico' /> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript" ></script> <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.6/jquery-ui.min.js" type="text/javascript" ></script> <script type="text/javascript">  </script> <link href="App_Themes/pageskin/theme.css" type="text/css" rel="stylesheet" /> <link rel='canonical' href='http://njcul.org/college-resource-center.aspx' /><style type="text/css"> .ctl01_SiteMenu1_ctl00_0 { background-color:white;visibility:hidden;display:none;position:absolute;left:0px;top:0px; } .ctl01_SiteMenu1_ctl00_1 { text-decoration:none; } .ctl01_SiteMenu1_ctl00_2 { } .ctl01_PageMenu1_ctl01_0 { background-color:white;visibility:hidden;display:none;position:absolute;left:0px;top:0px; } .ctl01_PageMenu1_ctl01_1 { text-decoration:none; } .ctl01_PageMenu1_ctl01_2 { } .ctl01_PageMenu2_ctl01_0 { text-decoration:none; } </style></head> <body class="pagebody" onLoad="MM_preloadImages('ps_menu_down.png')"> <form method="post" action="/college-resource-center.aspx" onsubmit="javascript:return WebForm_OnSubmit();" id="aspnetForm"> <div> <input type="hidden" name="ctl01_ScriptManager1_HiddenField" id="ctl01_ScriptManager1_HiddenField" value="" /> <input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" /> <input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" /> <input type="hidden" name="__VIEWSTATEFIELDCOUNT" id="__VIEWSTATEFIELDCOUNT" value="45" /> <input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKMjA1OTAyNzk1MQ9kFgJmD2QWBAIBDxYCHgdwcm9maWxlBR5OZXcgSmVyc2V5IENyZWRpdCBVbmlvbiBMZWFndWVkAgMP" /> <input type="hidden" name="__VIEWSTATE1" id="__VIEWSTATE1" value="ZBYiAgEPFgIeD1NpdGVNYXBQcm92aWRlcgUJbW9qb3NpdGUxZAIDDxYEHwEFCW1vam9zaXRlMR4PU3RhcnRpbmdOb2RlVXJsBQt+" /> <input type="hidden" name="__VIEWSTATE2" id="__VIEWSTATE2" value="L2hvbWUuYXNweGQCBQ8WBB8BBQltb2pvc2l0ZTEfAgUYfi9lZHVjYXRpb24tLWV2ZW50cy5hc3B4ZAIHDxYCHwEFCW1vam9zaXRl" /> <input type="hidden" name="__VIEWSTATE3" id="__VIEWSTATE3" value="MWQCFQ8PFgIeB1Zpc2libGVoZGQCGw9kFgJmDw8WAh8DaGQWBgIBDxYCHwNoFgJmDw8WAh4EVGV4dAULU2l0ZSBTZWFyY2hkZAID" /> <input type="hidden" name="__VIEWSTATE4" id="__VIEWSTATE4" value="Dw8WAh8DaGRkAgUPDxYCHwNoZGQCIQ8PFgIfA2hkZAInD2QWAgIBDw8WAh8DaGRkAi0PZBYGAgEPDxYCHghJbWFnZVVybAUrL0Rh" /> <input type="hidden" name="__VIEWSTATE5" id="__VIEWSTATE5" value="dGEvU2l0ZXMvMS9za2lucy9Jbm5lclRlbXBsYXRlL2hlYWQxLmpwZ2RkAgMPDxYCHwUFKy9EYXRhL1NpdGVzLzEvc2tpbnMvSW5u" /> <input type="hidden" name="__VIEWSTATE6" id="__VIEWSTATE6" value="ZXJUZW1wbGF0ZS9oZWFkMi5qcGdkZAIFDw8WAh8FBSsvRGF0YS9TaXRlcy8xL3NraW5zL0lubmVyVGVtcGxhdGUvaGVhZDMuanBn" /> <input type="hidden" name="__VIEWSTATE7" id="__VIEWSTATE7" value="ZGQCLw9kFgRmDw8WAh8DaGRkAgQPDxYCHwNoZGQCMQ8PFgQeCENzc0NsYXNzBTlhcnQtbGF5b3V0LWNlbGwgYXJ0LXNpZGViYXIx" /> <input type="hidden" name="__VIEWSTATE8" id="__VIEWSTATE8" value="IGxlZnRzaWRlIGxlZnQyY29sdW1uIGNtc3pvbmUeBF8hU0ICAmQWBAIBD2QWAgICD2QWAmYPZBYCAgEPZBYCZhA8KwAJAgAPFhIe" /> <input type="hidden" name="__VIEWSTATE9" id="__VIEWSTATE9" value="FENvbGxhcHNlSW1hZ2VUb29sVGlwBRNDb2xsYXBzZSB0aGlzIG5vZGUuHg1QYXRoU2VwYXJhdG9yBHweC0V4cGFuZERlcHRoZh4S" /> <input type="hidden" name="__VIEWSTATE10" id="__VIEWSTATE10" value="RXhwYW5kSW1hZ2VUb29sVGlwBRFFeHBhbmQgdGhpcyBub2RlLh4SU2hvd0V4cGFuZENvbGxhcHNlZx4NTmV2ZXJFeHBhbmRlZGQe" /> <input type="hidden" name="__VIEWSTATE11" id="__VIEWSTATE11" value="C18hRGF0YUJvdW5kZx4XUG9wdWxhdGVOb2Rlc0Zyb21DbGllbnRnHgxEYXRhU291cmNlSUQFEGxldmVsM2RhdGFzb3VyY2VkCBQr" /> <input type="hidden" name="__VIEWSTATE12" id="__VIEWSTATE12" value="AAsFPzA6MCwwOjEsMDoyLDA6MywwOjQsMDo1LDA6NiwwOjcsMTo3LDA6NywwOjgsMTo4LDA6OCwxOjgsMDo4LDA6ORQrAAIWDB8E" /> <input type="hidden" name="__VIEWSTATE13" id="__VIEWSTATE13" value="BRJDYWxlbmRhciBvZiBFdmVudHMeBVZhbHVlBSQyMmU3NmVlZC1iZWM0LTRjNWItYWJhNC04MTVjNTJmNTJiNDQeC05hdmlnYXRl" /> <input type="hidden" name="__VIEWSTATE14" id="__VIEWSTATE14" value="VXJsBRl+L2NhbGVuZGFyLW9mLWV2ZW50cy5hc3B4HghEYXRhUGF0aAUCNjceCURhdGFCb3VuZGceEFBvcHVsYXRlT25EZW1hbmRo" /> <input type="hidden" name="__VIEWSTATE15" id="__VIEWSTATE15" value="ZBQrAAIWDB8EBRBDaGFwdGVyIE1lZXRpbmdzHxEFJGNiZGUyMTFhLTc0YzItNDI2Zi05NjQ4LTQ5NTY2ZjY4NjViNx8SBRd+L2No" /> <input type="hidden" name="__VIEWSTATE16" id="__VIEWSTATE16" value="YXB0ZXItbWVldGluZ3MuYXNweB8TBQI2OB8UZx8VaGQUKwACFgwfBAUOU3BlY2lhbCBFdmVudHMfEQUkODgxZjE0Y2EtMWI0NC00" /> <input type="hidden" name="__VIEWSTATE17" id="__VIEWSTATE17" value="YjYxLWE2YmQtMjk2Mzc0NzMyZGY1HxIFFX4vc3BlY2lhbC1ldmVudHMuYXNweB8TBQI2OR8UZx8VZ2QUKwACFgwfBAUURWR1Y2F0" /> <input type="hidden" name="__VIEWSTATE18" id="__VIEWSTATE18" value="aW9uYWwgU2Vzc2lvbnMfEQUkM2QxYTBmZWUtMTk1Ny00MGYwLThlMzItNzEzMjM4ZDM5Yjg5HxIFG34vZWR1Y2F0aW9uYWwtc2Vz" /> <input type="hidden" name="__VIEWSTATE19" id="__VIEWSTATE19" value="c2lvbnMuYXNweB8TBQI3MB8UZx8VZ2QUKwACFgwfBAUsU3BlY2lhbCBDVSBEaXJlY3RvciAmYW1wOyBWb2x1bnRlZXIgUHJvZ3Jh" /> <input type="hidden" name="__VIEWSTATE20" id="__VIEWSTATE20" value="bXMfEQUkMGRjNWUwY2EtMWQyNy00N2JlLTgwMjgtNmYzY2Q2NmNjNTkzHxIFLX4vc3BlY2lhbC1jdS1kaXJlY3Rvci12b2x1bnRl" /> <input type="hidden" name="__VIEWSTATE21" id="__VIEWSTATE21" value="ZXItcHJvZ3JhbXMuYXNweB8TBQMxNjgfFGcfFWhkFCsAAhYMHwQFG0NVTkEgTGVhcm5pbmcgT3Bwb3J0dW5pdGllcx8RBSQyZTRl" /> <input type="hidden" name="__VIEWSTATE22" id="__VIEWSTATE22" value="YWYyMS0wNjEwLTQ5OWYtYTVmMy1lN2VlNjM2ZWZiMmUfEgUifi9jdW5hLWxlYXJuaW5nLW9wcG9ydHVuaXRpZXMuYXNweB8TBQI2" /> <input type="hidden" name="__VIEWSTATE23" id="__VIEWSTATE23" value="Nh8UZx8VaGQUKwACFgwfBAUrWW91dGggSW52b2x2ZW1lbnQgQm9hcmQgU2Nob2xhcnNoaXAgUHJvZ3JhbR8RBSRjNjUzMjQwNC1k" /> <input type="hidden" name="__VIEWSTATE24" id="__VIEWSTATE24" value="OTY1LTQ4ZmYtYTZhNC02YmFkYjU4ZDE0YTAfEgUKfi95aWIuYXNweB8TBQI5Nh8UZx8VaGQUKwACFgwfBAUbRXhlY3V0aXZlIExl" /> <input type="hidden" name="__VIEWSTATE25" id="__VIEWSTATE25" value="YWRlcnNoaXAgU2VyaWVzHxEFJDE0MTg2ZTUzLWI4MWMtNDIzOS1iMDM5LWY5N2U2ZTI2ZDU4OR8SBQp+L2Vscy5hc3B4HxMFAzEy" /> <input type="hidden" name="__VIEWSTATE26" id="__VIEWSTATE26" value="OR8UZx8VaGQUKwACFgwfBAUUQ2VydGlmaWNhdGUgUHJvZ3JhbXMfEQUkNjMxYWFkMzctY2NhZS00OTFhLWE3YjAtODI3NzM5YWM1" /> <input type="hidden" name="__VIEWSTATE27" id="__VIEWSTATE27" value="NjZhHxIFGn4vY2VydGlmaWNhdGVwcm9ncmFtcy5hc3B4HxMFAzE1Mx8UZx8VZ2QUKwACFhAfBAUXQ29sbGVnZSBSZXNvdXJjZSBD" /> <input type="hidden" name="__VIEWSTATE28" id="__VIEWSTATE28" value="ZW50ZXIfEQUkOTI3NDJkM2QtZTYzYS00OTg2LTgwMTYtYjNkNjlhNWU5NzA3HxIFHn4vY29sbGVnZS1yZXNvdXJjZS1jZW50ZXIu" /> <input type="hidden" name="__VIEWSTATE29" id="__VIEWSTATE29" value="YXNweB8TBQMxNjYfFGceCFNlbGVjdGVkZx8VaB4IRXhwYW5kZWRnZAUPY3RsMDEkY3RsMDZ8bm5uZAIDDw8WAh8DaGRkAjMPDxYE" /> <input type="hidden" name="__VIEWSTATE30" id="__VIEWSTATE30" value="HwYFNWFydC1sYXlvdXQtY2VsbCBhcnQtY29udGVudCBjZW50ZXItbGVmdG1hcmdpbiBjbXN6b25lHwcCAmQWBgIBD2QWAmYPDxYE" /> <input type="hidden" name="__VIEWSTATE31" id="__VIEWSTATE31" value="HwYFC2JyZWFkY3J1bWJzHwcCAmQWAgIBDzwrAAUBAA8WBh4VUGFyZW50TGV2ZWxzRGlzcGxheWVkAgIfCQUDID4gHwNnZBYGZg9k" /> <input type="hidden" name="__VIEWSTATE32" id="__VIEWSTATE32" value="FgICAQ8PFggfEgUKL2hvbWUuYXNweB8EBQRIb21lHwYFD3Vuc2VsZWN0ZWRjcnVtYh8HAgJkZAICD2QWAgIBDw8WCB8SBRcvZWR1" /> <input type="hidden" name="__VIEWSTATE33" id="__VIEWSTATE33" value="Y2F0aW9uLS1ldmVudHMuYXNweB8EBRZFZHVjYXRpb24gJmFtcDsgRXZlbnRzHwYFD3Vuc2VsZWN0ZWRjcnVtYh8HAgJkZAIED2QW" /> <input type="hidden" name="__VIEWSTATE34" id="__VIEWSTATE34" value="AgIBDw8WCB8SBR0vY29sbGVnZS1yZXNvdXJjZS1jZW50ZXIuYXNweB8EBRdDb2xsZWdlIFJlc291cmNlIENlbnRlch8GBQ1zZWxl" /> <input type="hidden" name="__VIEWSTATE35" id="__VIEWSTATE35" value="Y3RlZGNydW1iHwcCAmRkAgMPDxYCHwNoZGQCBQ9kFgJmD2QWAmYPDxYEHwYFCW1vZHVsZTI0MR8HAgJkFgICAQ9kFgICAw9kFgIC" /> <input type="hidden" name="__VIEWSTATE36" id="__VIEWSTATE36" value="Aw9kFgICAQ8PFgQeC0NvbnRlbnRHdWlkKClYU3lzdGVtLkd1aWQsIG1zY29ybGliLCBWZXJzaW9uPTIuMC4wLjAsIEN1bHR1cmU9" /> <input type="hidden" name="__VIEWSTATE37" id="__VIEWSTATE37" value="bmV1dHJhbCwgUHVibGljS2V5VG9rZW49Yjc3YTVjNTYxOTM0ZTA4OSRmOWU3YTZiYy1lYjYzLTQ0YzQtOGQyYS1hYTEyMmZmMTJh" /> <input type="hidden" name="__VIEWSTATE38" id="__VIEWSTATE38" value="YTMfA2hkFgICAQ9kFgJmD2QWBAIFD2QWAmYPFgIeCkNhbGxiYWNrSUQFKWN0bDAxJG1haW5Db250ZW50JGN0bDAwJFJhdGluZyRV" /> <input type="hidden" name="__VIEWSTATE39" id="__VIEWSTATE39" value="c2VyUmF0aW5nZAIHDxYCHxEFJGY5ZTdhNmJjLWViNjMtNDRjNC04ZDJhLWFhMTIyZmYxMmFhM2QCNQ8PFgYfBgURcmlnaHRzaWRl" /> <input type="hidden" name="__VIEWSTATE40" id="__VIEWSTATE40" value="IGNtc3pvbmUfBwICHwNoZGQCNw8PFgQfBgUTYWx0Y29udGVudDIgY21zem9uZR8HAgJkZAI5Dw8WBB8GBRNhbHRjb250ZW50MiBj" /> <input type="hidden" name="__VIEWSTATE41" id="__VIEWSTATE41" value="bXN6b25lHwcCAmRkAj0PDxYCHwNoZBYKAgEPDxYCHwNoZGQCAw8PFgIfA2hkZAIFDw8WAh8DaGRkAgcPDxYCHwNoZGQCCQ8PFgIf" /> <input type="hidden" name="__VIEWSTATE42" id="__VIEWSTATE42" value="A2hkZAJBDw8WAh8DaGRkGAMFHl9fQ29udHJvbHNSZXF1aXJlUG9zdEJhY2tLZXlfXxYBBRVjdGwwMSRQYWdlTWVudTIkY3RsMDEF" /> <input type="hidden" name="__VIEWSTATE43" id="__VIEWSTATE43" value="FWN0bDAxJFBhZ2VNZW51MSRjdGwwMQ8PZAUkY2E4YTRkMmQtYWZkMy00ZGQ2LWIxYzEtYWY0MjhiOTc4ZThjZAUVY3RsMDEkU2l0" /> <input type="hidden" name="__VIEWSTATE44" id="__VIEWSTATE44" value="ZU1lbnUxJGN0bDAwDw9kBSQ2ZWU5NzFjZC05OTU2LTRkYzMtODE2Mi1hNDg4NDEzZTdmNThk" /> </div> <script type="text/javascript"> //<![CDATA[ var theForm = document.forms['aspnetForm']; if (!theForm) { theForm = document.aspnetForm; } function __doPostBack(eventTarget, eventArgument) { if (!theForm.onsubmit || (theForm.onsubmit() != false)) { theForm.__EVENTTARGET.value = eventTarget; theForm.__EVENTARGUMENT.value = eventArgument; theForm.submit(); } } //]]> </script> <script src="/WebResource.axd?d=x2eneDuLFQ9w4yRoi8Y5tg2&t=634230536572508135" type="text/javascript"></script> <script type="text/javascript">var GB_ROOT_DIR = '/ClientScript/greybox/'; var GBCloseText = 'Close'; </script> <script src="/ClientScript/mojocombined/mojocombinedfull.js" type="text/javascript" ></script> <script src="/ClientScript/jqmojo/cycle.js" type="text/javascript" ></script> <script src="/ScriptResource.axd?d=wCo0V0P8aplVAKjdc-kM9AvNmwrQFDA24wrkA7OkI6gOYp_VxxHWIc8VlP8L0l200&t=fffffffff615adfd" type="text/javascript"></script> <script type="text/javascript"> //<![CDATA[ Sys.Services._AuthenticationService.DefaultWebServicePath = 'Authentication_JSON_AppService.axd'; Sys.Services._RoleService.DefaultWebServicePath = 'Role_JSON_AppService.axd'; //]]> </script> <script src="/ScriptResource.axd?d=wCo0V0P8aplVAKjdc-kM9AvNmwrQFDA24wrkA7OkI6gjdZ5z-Kq5dVZ7FGYv9jU40&t=fffffffff615adfd" type="text/javascript"></script> <script type="text/javascript"> //<![CDATA[ function WebForm_OnSubmit() { document.getElementById('ctl01_ctl06').value = GetViewState__AspNetTreeView('ctl01_PageMenu2_ctl01_UL'); return true; } //]]> </script> <script type="text/javascript"> //<![CDATA[ Sys.WebForms.PageRequestManager._initialize('ctl01$ScriptManager1', document.getElementById('aspnetForm')); Sys.WebForms.PageRequestManager.getInstance()._updateControls(['tctl01$PageMenu1$upMenu','tctl01$PageMenu2$upMenu'], [], [], 90); //]]> </script> <div id="wrapwebsite"> <img src="top.png" border="0" width="900" height="36"> <div class="topnav"> <ul> <li class="firstnav"><a class="sitelink homelink" href="/">Home</a></li> <li class="topnavitem"><a class="sitelink" href="/SiteMap.aspx">Site Map</a></li> <li class='topnavitem'><a href='/SearchResults.aspx' class='sitelink'>Search</a></li> <li class="topnavitem"><a class="sitelink" href="/Secure/Login.aspx">Sign In</a></li> </ul> <a href='#startcontent' class='skiplink'>Skip over navigation</a> <div id="ctl01_pnlStandardLogin" class="floatpanel"> </div> <div class="addthis"> <div id="ctl01_InsecurePanel1" class="addthisbutton"> </div> </div> </div> <div id="topmenu"> <div class="AspNet-Menu-Horizontal" id="ctl01_SiteMenu1_ctl00"> <ul class="AspNet-Menu"> <li class="AspNet-Menu-Leaf AspNet-Menu-SelectedLeaf"> <a href="/home.aspx" class="AspNet-Menu AspNet-Menu-SelectedLeaf"> <img src="Data/SiteImages/FeatureIcons/house.png" alt="Home" /> Home</a> </li> <li class="AspNet-Menu-Leaf"> <a href="/professional-products-and-services.aspx" class="AspNet-Menu"> Professional Products and Services</a> </li> <li class="AspNet-Menu-Leaf"> <a href="/news-publications-announcements.aspx" class="AspNet-Menu"> News, Publications & Announcements</a> </li> </ul> </div> </div> <div id="wrapheader"> <a href="/default.aspx"><img src="logo.png" border="0" width="420" height="104" align="left"></a> <a href="Secure/Login.aspx" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('memberLogin','','ps_menu_down2.png',1)"><img src="ps_menu_up2.png" alt="Member Login" name="memberLogin" width="171" height="20" border="0" style="padding-left:270px; padding-top:0px;"></a><br />  <a href="professional-products-and-services.aspx"><img src="productServicesNav.jpg" border="0" width="203" height="37" style="padding-left:200px; padding-top:54px;"></a>  </div> <div id="outercontainer"> <div id="ctl01_PageMenu1_upMenu"> <div class="AspNet-Menu-Horizontal" id="ctl01_PageMenu1_ctl01"> <ul class="AspNet-Menu"> <li class="AspNet-Menu-Leaf"> <a href="/consumer-advocacy.aspx" class="AspNet-Menu"> Consumer Advocacy</a> </li> <li class="AspNet-Menu-Leaf"> <a href="/compliance.aspx" class="AspNet-Menu"> Compliance</a> </li> <li class="AspNet-Menu-Leaf AspNet-Menu-SelectedLeaf"> <a href="/education--events.aspx" class="AspNet-Menu AspNet-Menu-SelectedLeaf"> Education & Events</a> </li> <li class="AspNet-Menu-Leaf"> <a href="/government-affairs.aspx" class="AspNet-Menu"> Government Affairs</a> </li> <li class="AspNet-Menu-Leaf"> <a href="/news.aspx" class="AspNet-Menu"> News</a> </li> <li class="AspNet-Menu-Leaf"> <a href="/about-us.aspx" class="AspNet-Menu"> About Us</a> </li> <li class="AspNet-Menu-Leaf"> <a href="/nj-credit-union-foundation.aspx" class="AspNet-Menu"> Foundation </a> </li> </ul> </div> </div> <div id="innercontainer"> <div id="wrapcenter"> <div id="ctl01_divLeft" class="art-layout-cell art-sidebar1 leftside left2column cmszone"> <div id="gutter"> <div id="ctl01_PageMenu2_upMenu"> <div class="AspNet-TreeView" id="ctl01_PageMenu2_ctl01"> <ul id="ctl01_PageMenu2_ctl01_UL"> <li class="AspNet-TreeView-Root AspNet-TreeView-Leaf"> <a href="/calendar-of-events.aspx"> Calendar of Events</a> </li> <li class="AspNet-TreeView-Root AspNet-TreeView-Leaf"> <a href="/chapter-meetings.aspx"> Chapter Meetings</a> </li> <li class="AspNet-TreeView-Root"> <a class="AspNet-TreeView-Expand" onclick="__doPostBack('ctl01$PageMenu2$ctl01','p881f14ca-1b44-4b61-a6bd-296374732df5'); return false;" href="/special-events.aspx" title="Expand this node."> </a> <a href="/special-events.aspx"> Special Events</a> </li> <li class="AspNet-TreeView-Root"> <a class="AspNet-TreeView-Expand" onclick="__doPostBack('ctl01$PageMenu2$ctl01','p3d1a0fee-1957-40f0-8e32-713238d39b89'); return false;" href="/educational-sessions.aspx" title="Expand this node."> </a> <a href="/educational-sessions.aspx"> Educational Sessions</a> </li> <li class="AspNet-TreeView-Root AspNet-TreeView-Leaf"> <a href="/special-cu-director-volunteer-programs.aspx"> Special CU Director & Volunteer Programs</a> </li> <li class="AspNet-TreeView-Root AspNet-TreeView-Leaf"> <a href="/cuna-learning-opportunities.aspx"> CUNA Learning Opportunities</a> </li> <li class="AspNet-TreeView-Root AspNet-TreeView-Leaf"> <a href="/yib.aspx"> Youth Involvement Board Scholarship Program</a> </li> <li class="AspNet-TreeView-Root AspNet-TreeView-Leaf"> <a href="/els.aspx"> Executive Leadership Series</a> </li> <li class="AspNet-TreeView-Root"> <a class="AspNet-TreeView-Expand" onclick="__doPostBack('ctl01$PageMenu2$ctl01','p631aad37-ccae-491a-a7b0-827739ac566a'); return false;" href="/certificateprograms.aspx" title="Expand this node."> </a> <a href="/certificateprograms.aspx"> Certificate Programs</a> </li> <li class="AspNet-TreeView-Root AspNet-TreeView-Leaf AspNet-TreeView-Selected"> <a href="/college-resource-center.aspx"> College Resource Center</a> </li> </ul> </div> </div> </div>  <a id="startcontent"></a> </div> <div id="ctl01_divCenter" class="art-layout-cell art-content center-leftmargin cmszone"> <div id="ctl01_Breadcrumbs_pnlWrapper" class="breadcrumbs"> <span id="ctl01_Breadcrumbs_breadCrumbsControl"><span> <a id="ctl01_Breadcrumbs_breadCrumbsControl_ctl00_lnkNode" class="unselectedcrumb" href="/home.aspx">Home</a> </span><span> > </span><span> <a id="ctl01_Breadcrumbs_breadCrumbsControl_ctl02_lnkNode" class="unselectedcrumb" href="/education--events.aspx">Education & Events</a> </span><span> > </span><span> <a id="ctl01_Breadcrumbs_breadCrumbsControl_ctl04_lnkCurrent" class="selectedcrumb" href="/college-resource-center.aspx">College Resource Center</a> </span></span> </div> <div id="ctl01_mainContent_ctl00_pnlContainer" class="module241"> <div id="ctl01_mainContent_ctl00_pnlWrapper" class="art-Post-inner panelwrapper htmlmodule"> <a id='module241' class='moduleanchor'></a><h2 class="art-PostHeader moduletitle">CUStudentLoans.org College Resource Center <a class="ModuleEditLink"></a></h2> <div class=" modulecontent"> <div id="ctl01_mainContent_ctl00_divContent" class="slidecontainer"> <style> /* Edit the font family and width of overall content */ #cusl-page { font-family: 'Lucida Grande', Lucida, Arial, sans-serif; font-size: 62.5%; width: 630px; } /* Link colors */ #cusl-page a { color: #004a80; } /* Header image */ #cusl-page #header { display:none !important; } /* Heading text color */ #cusl-content h2 { color: #0e6c55; font-size:18px; } #cusl-page aside h3 a { font-size:16px } #cusl-page aside h2 { font-size:18px; } #cusl-content article h3 a { font-size:20px; line-height:26px !important; } </style> <script src="https://www.custudentloans.org/javascripts/cusl-page.js"></script> <script> new CUSL.Page({ count: 5, // defaults to 7 cu_url: 'http://www.custudentloans.org' }).render(); </script> <div id="footer"> <p><a target="_blank" href="http://www.custudentloans.org/student/college-financing-101">Learn more about Private Student Loans at <em>Ken's Korner</em></a></p> </div> </div> </div> <div class="modulefooter"></div> <div class="cleared"></div> </div> </div> </div> </div> <div id="ctl01_divAlt1" class="altcontent2 cmszone"> </div> <div id="ctl01_divAltContent2" class="altcontent2 cmszone"> </div> <div id="wrapfooter"> <img src="footerImage.png" border="0" width="900" height="134"> © 2008 - 2011 New Jersey Credit Union League | <a href="/privacy-policy.aspx">Privacy Policy</a> | Design and Website by: <a href="http://www.greylockmarketing.com/" target="_blank">Greylock Marketing</a> & <a href="http://www.socialboostmedia.com/" target="_blank">Social Boost Media</a> <br /> <br /> </div> </div> </div> </div> <script type="text/javascript"> function HideMenuToolbar(){ $("#toolbar").fadeOut(); $("#toolbarbut").fadeIn("slow");} function ShowMenuToolbar(){ $("#toolbar").fadeIn(); $("#toolbarbut").fadeOut("slow");} $(document).ready(function(){ $("span.downarr a").click(function() {HideMenuToolbar(); Set_Cookie('openstate', 'closed')}); $("span.showbar a").click(function() {ShowMenuToolbar(); Set_Cookie('openstate', 'open') }); $("span.downarr a, span.showbar a").click(function() { return false; }); var openState = Get_Cookie('openstate'); if(openState != null){ if(openState == 'closed'){HideMenuToolbar();} if(openState == 'open'){ShowMenuToolbar();}} }); </script> <div> <input type="hidden" name="ctl01$ctl06" id="ctl01_ctl06" /> </div> <div> <input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEWBQKv1e3VCALs75XzDgL+qaz3AwLv26TNCQKS/MC2Dg==" /> </div> <script type="text/javascript">Sys.Application.add_load(function() { var form = Sys.WebForms.PageRequestManager.getInstance()._form; form._initialAction = form.action = window.location.href; }); </script> <script type="text/javascript"> //<![CDATA[ (function() {var fn = function() {$get("ctl01_ScriptManager1_HiddenField").value = '';Sys.Application.remove_init(fn);};Sys.Application.add_init(fn);})(); WebForm_InitCallback();//]]> </script> <script type="text/javascript" > $('div.mojo-accordion').accordion({fx:{opacity:'toggle',duration:'fast'}}); $('div.mojo-accordion-nh').accordion({fx:{opacity:'toggle',duration:'fast'},autoHeight:false}); $('div.mojo-tabs').tabs({fx:{opacity:'toggle',duration:'fast'}}); $('input.jqbutton').button(); </script> <script type="text/javascript">$('#ctl01_spanel1').cycle({fx:'fade',speed:1000,timeout:3000,next:'#ctl01_spanel1'});</script> <script type="text/javascript"> var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www."); document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E")); </script> <script type="text/javascript"> try{ var mojoPageTracker = _gat._getTracker("UA-19333588-1"); mojoPageTracker._setCustomVar(1, "member-type", "anonymous", 1);mojoPageTracker._trackPageview(); } catch(err) {} </script> <script type="text/javascript"> //<![CDATA[ Sys.Application.initialize(); //]]> </script> </form> </body> </html>

Search Results

Search found 3173 results on 127 pages for 'satellite navigation'.

Page 127/127 | < Previous Page | 123 124 125 126 127

- by Adam Nygate

- by mvg

- by Nullstr1ng

- by Paul

- by Rick Strahl

- by Rick Strahl

- by Rick Strahl

- by Shaul

- by Brian

- by user2697032

- by span

- by Atharul Khan

- by jwandborg

- by Sergei

- by brumila

- by Mark

- by kwek-kwek

- by Kodi Lane

- by Elmir Kouliev

- by Jess McKenzie

- by Jeremy

- by MattDiPasquale

< Previous Page | 123 124 125 126 127