I am building a single page scrolling MVC website that needs to be able to move to different sections of the page when a link is clicked, preferably without refreshing the page, just scrolling to said location on click event. My question is whether this would be some JavaScript or whether I can do so with just some regular and some C#.
As Alexei Darmin said in a comment try to use #id's in divs and refer to those id's in your links, that's the tipical way to do it and you shouldn't have any problem unless you load the content dinamically, in that case you should implement a method in your angular control that force the async load to, at least, that point and move the user to it.
For single Page application, Angular Js is more efficient and you can achieve the performance also. And also if you use this script, your app is like Web Api,you can control your resolutions for different devices.
Angular Js is best , so you can use in your app. hope it will useful to you. Thanks.
just refer its useful to you :
Link1
Link2
Related
I looked on many posts but I've never found out such a context like the one I have so I'm requesting you some help.
Here is my development context :
I had in mind to build a single-page based PHP Application and I then chose to set-up a global container page embedding a side navbar-menu on the left for navigation control and an iframe on the right for related content.
The iframe is updated following the navigation navbar to display the selected content to the user.
First, I'm not saying that this is the right way to do this kind of PHP Application and would be ears opened to different way to achieve this.
For now, it's working out but I rose up a problem since I would like to reload only A PART of my content iframe. Indeed, there is a div box inside it that should be updated when the rest shouldn't (or at least it looks strange during navigation).
I was wondering if setting-up a listener on the iframe to look on mysql database updates and then trigger a JS function would be memory cost efficient ?
What would you guys think ? Maybe there's a different way to solve this problem (I was thinking of a big AJAX rendering instead of an iframe for example) ?
Thanks a lot for your answers,
Martin
Okay so for those who would face the same situation I ended up trigerring an ajax function in my child iframe from the parent main page via the instruction document.getElementbyId("myIframe").contentWindow.myAjaxFunction() that run the search script in background (with post parameters from the parent page).
Then I got the reload of only a section of the iframe.
Recently I designed a page which has a navigation bar with four buttons. The user is directed to different page on clicking each different button. For the buttons I'm using the following code,
<button type="button" class="subheader-buttons" onclick="window.loation=document.location.href='PAGE 1'">Button 1</button>
I'am using the above code for all the four buttons. Now I'am wondering whether it will be advantageous to use links instead of buttons? Do links goes from one page to another faster than the buttons?
I believe it is much faster just linking, since what your doing is executing javascript which takes more than just linking it in an href!
But still this is a very big debate!
I take this info from uxmovement.com
When we look at the web, links outnumber buttons on most websites. The reason for this is because
links are easier to create
links are simple and sufficient
links don’t overshadow content
Buttons, however, are the opposite.
buttons take more time and effort to create
buttons can come in different sizes, colors and styles
buttons can sometimes overshadow content
You can get more info on this website:
http://getlevelten.com/blog/randall-knutson/design-decisions-buttons-vs-links-fight
You should use <a href=""> over window.location.href, for several good reasons.
Firstly If you have your javascript disabled, then none of the links would work.
Google Bot do not interpret javascript, and so they won't follow any of your links.
For more info: window.location.href vs clicking on an Anchor
Using a standard HTML link is the common way to do it. Although both methods will be roughly as fast.
Technically, because you're using JS with your button, your browser has to run the code before sending you to a different page so it may take a fraction of a second longer.
You could make a link a button without using JS:
<a href="your-page.html">
<button>Your Page</button>
</a>
It's the same. You can use <button></button> if you want.
However, use javascript to link to other page may take a sightly slow, u can check by using network
I think a link would be faster. In both, the web server will be going to the link specified by href. However, a link would just be that - a call to redirect. However, a button, as far as I am aware, sends much more data to the webserver, and also has many more things react to it - aka more overhead. Therefore, the link may be faster. However, it would only have a marginal effect really, unless you had a lot of traffic to your website, so I don't think it matter to much - you should probably just go with whatever you feel comfortable with.
I also just wanted to point out that I don't think using javascript to navigate to the page like that may be the best idea, regardless of whether you are using links or buttons. Serving webpages is a job for the webserver, and thus javascript calls may not be the best. Using the language that you are using for your web server (and if you are not, then I suggest you start using a back-end for your website), you should be able to respond easily to the button click / page redirect. The upside of this would be that it would also allow for any extra work to be done on the page as required.
The difference wouldn't be significant (or even noticeable by human). There are other concerns (most importantly accessibility) as to whether to use onclick or href.
I have added my visualforce page to Account page and found that I can set only fixed height. I wrote javascript solution for auto height. First part I added to the parentAccount page by adding new button with {!REQUIRESCRIPT("my_scipt_here")}, second part I added to visualforce page.
s it possible to add javascipt to the "parent" Account page without adding Custom Button?
I'm not aware of any way to run javascript on a page other than by using a button (or maybe a link as a field), though it'd be good to know if there is one but I highly doubt it would be available, or if it is, supported.
Would overriding the Account view page with a full visualforce page be an option where you use an <apex:detail> tag to get the standard fields etc.?
Remember that Visualforce components on page layouts occur as iframes. If the domains match up, which may or may not be the case - you could inject JavaScript from the iframe to the parent.
This may give more details:
Inject javascript function into parent window from iframe
I've tried using the standard Facebook like button. I require about 50 like buttons (that number may grow) on my page. The problem is that the second I add more than a few, it drastically slows down my page. If I show all 50 like buttons, the page is practically unoperable, the browser refuses to scroll, freezes and gives "Not responding" warnings etc.
I assume this is because the like buttons weren't made to be displayed multiple times on one page, and it does a LOT of redundant work for every added button. I've seen it be done though, so I'm wondering: is there some special way of displaying lots of Facebook like buttons on one page? I'm talking tens, perhaps hundreds.
Thanks
There are two ways I would recommend doing this. One is to render a fake Facebook button (static image) and then on hover, dynamically load the real Facebook like button to replace the image. The other is to use one of the various jquery scrolling plugins to load the Facebook like buttons as the content becomes visible on the page. TechCrunch.com has lots of like buttons on their home page without performance issues (they are doing the second option I listed).
I think you must implement your own FB link, example:
<a href="http://www.facebook.com/share.php?u=your-url" class="someFBClass" ><span class=icon></span> Facebook</a>
real example
You have to add some css to make the link look FB link.
You can do this by doing using the FB.XFBML.parse method.
http://developers.facebook.com/docs/reference/javascript/FB.XFBML.parse/
This allows you to render the like as and when you need them, each just the one in the veiwport.
Also to make sure, your not loading the facebook javascript SDK (the old XFBML way) for each like button?
I have a page where in a photo and description link is there, i want replace the hard coded link with a javascript,which will add them,as i dont want the search engine to scroll the links.I dont wanna use "nofollow" attribute.How to code it in js.
Update: I may have misunderstood you - I thought you want to keep search engine visibility. Can you clarify which one you want? If you don't want the links and images to be indexed, I'd say nofollow is in fact your best friend. A JavaScript based solution is of course doable, but will lock out clients that don't have it enabled.
Original answer
The usual way would be to keep the link in a standard href attribute, and adding a JavaScript onclick event that does its thing using the href, and returns false so the "normal" link doesn't get triggered.
This leaves a search engine-readable link in place, and enables clients with JavaScript disabled to still somehow access the image.
This technique is also known as progressive enhancement.
I would be surprised is Google couldn't handle links created from Javascript. If you want to keep the linked pages unindexed, use nofollow on the link or noindex on the target page or add them to robots.txt.