How to make a wizard style like: http://www.codecademy.com/courses/web-beginner-en-HZA3b/0/1?curriculum_id=50579fb998b470000202dc8b (when open page then it shows a tooltip with "NEXT" button on it which explains how to use the application)
I have searched for JQuery Wizard or Steps on Google but nothing similar found. I have tried to use http://thecodemine.org/# a formwizard and adapt to my website but with no result because it is for forms.
If this isn't the place to ask questions as this, please tell me to delete.
Also you can use http://linkedin.github.io/hopscotch/ for normal
or http://bootstraptour.com/ if you using bootstrap
Try "Website Tour Plugin":
http://tympanus.net/codrops/2010/12/21/website-tour/
It is similar to your recommended link.
Related
We are using Bootstrap nav-tabs on our new website's events pages to create different sections on a single page related to our events — About, Speakers, Travel, Register and so on.
Our events coordinator would like to be able to link directly to the individual speakers who appear on the Speakers tab from outside the website. Normally, this is pretty simple — http://domain.name/events/eventspage#speakerID.
However, because we're using nav-tabs, there isn't an easy and obvious way of creating this link. I've looked through posts here and elsewhere to see if anyone else has addressed this problem, but have yet to find anything.
The site was built using Bootstrap 3 and uses ExpressionEngine 2.10 as the CMS.
You can view a working example of how our events pages are set up at https://www.rjionline.org/events/rjicollab.
Any suggestions would be appreciated.
This is how it can work with jQuery:
Select an anchor within a JQUERY Tab from a link on anther webpage
You can adapt the code from there.
Here you can try this function:
function goToTab(){
var hash=document.location.hash,
prefix="tab_";
if(hash)
$('.nav-tabs a[href='+hash.replace(prefix,"")+']').tab('show')
};
How can I add this function to something: http://awesomescreenshot.com/0ec17ri8dc
Its from this page.
Notice when you click on it a popup appears with the generated html to add the code somewhere. Have ben unable to find a good google search query that doesn't bring up irrelevant pages.
Thanks in adv.
Here's a quick solution.
If you know some basic jQuery you won't have problems with understanding the code but feel free to ask if you need any help.
Keep in mind that the code won't trigger a pop-up, it's just to get the embed code. I'd suggest using some plugin for this, fancybox is a good one.
Is there any good JavaScript/jQuery plug-in that will 'quicklook' an information on click?
I want it simple so when you click the quick view link it just displays it as a modal form
Ideally it would be set up by just giving said links a class and the JavaScript/jQuery does the rest.
Similar to the (http://us.norton.com/downloads/) quick view button.
qtip plugin might come in handy too
Norton is using colorbox i think.. http://www.jacklmoore.com/colorbox/
colorbox is a jQuery lightbox.. you can customize it using CSS.. it can handel inline content as well as fetch data by making an ajax call
Please have a look at http://500px.com/photo/3977429?from=popular. Down in the right corner, theres a sharing box. It looks pretty similar to sharethis. But, afaik, sharethis doesnt have embed or submit for example, and im looking for those options. Does anyone know which plugin is used here? Thanks
On the page you linked to, they didn't use anything like sharethis or addthis - they rolled their own. Looking at the code, its clear that they went to facebook, got the facebook like button, embedded it - then wen to google, got the google plus button, etc... and made a grid of them.
You can stylize the sharethis buttons with css to pretty much any extent,
or you can add a grid like that of your own.
The available alternatives to sharethis.com are :
addthis.com
addtoany.com
socialmarker.com
I'm sure there a a lot more out there, but those seem to be the most popular.
If you want something custom like they have and want access to the buttons
here are some sets of images you may be able to use:
http://speckyboy.com/2009/01/26/30-amazingly-creative-social-bookmarks-icon-sets/
Inspecting the source leads me to believe that it is custom work. The images, links and such are placed in the HTML serverside. Only the stumbleupon is pulled from stumbleupon itself. But also not trough some third party service like sharethis.
can anyone provide me any ideas about how to import a facebook like box, in my site. I would it to seem like the one in the folowing site "http://www.babyspace.gr/". Does any of the existing javascript frameworks afford such a functionality?
Thank you in advance
It is simple Facebook social plugin called Like Box and you can get it here: http://developers.facebook.com/plugins?footer=1
You can install it on any webpage quite easily - If you follow the instructions on the page linked above.
About the slider - It can be achieved quite easily with jQuery. Put the Like Box on some div and use jQuery animate to show it by click.