So I've been looking all over and seen a couple of similar posts but nothing that truly answers my question. I want to be able to resize divs and the content within it similar to the style of the new lafitness.com website. I notice they are using silverlight for this function. I was curious if anyone knew how to do this in Javascript? Thank you so much for your help.
That effect is awful...
however here is something similar in javascript that came to mind
http://isotope.metafizzy.co/index.html
Related
I'm trying to make text overflow when you resize a window, like pretty much every site does. However, I have zero experience with HTML and CSS, so I only have JavaScript (I'm using the p5 library) to work with. Does anyone know if there's a way for me to do one of two things:
Make the text overflow somehow
Learn HTML and CSS (is there a good tutorial out there?)
Or should I just change it so that a certain window size changes the text manually in the code from "Example Text" to "Example\nText"? Basically, is there some function I should know about, should I do it manually, or is there a good tutorial for beginner to advanced HTML/CSS? I realize that I'm basically asking for a tutorial online, but I'm also hoping there's some other way. Help!!! :P
Did you mean Text-wrap which wraps your text content inside the div element?
TLDR; Use word-wrap or overflow-wrap.
Check this out
Also, check out this tutorial from FreeCodeCamp. You can learn pretty much all the basics from their website itself. HTML & Css
Okaay, ive been dealing with this problem for quite some time now, and i really need to get an answer now :D The problem is, when im resizing the window, all my elements just messes up. When i try resize other websites(could be anyone; facebook, twitter, even stackoverflow) it does NOT harm any elements. The view just get smaller. How do i do this?
General answer in a general tone:
Conduct some research on responsive web design practice. Learning about different types of layouts (Flexible, full responsive etc.) will certainly help understand the possibilities you have with only CSS and HTML. At least discovering this knowledge will enable you to speak more closely with your developer and head in the right direction.
Cheers!
LaddtheImpaler
i bet everyone of you has seen www.tumblr.com
right on the registration page on the bottom you see the '30 reasons...' link that slides the complete page up and reveals a second one.
i found ways to do this with putting two sides into one and just scrolling to the second part, but tumblr seems to have 2 different pages there that swap somehow with a slide effect.
im pretty sure it is done with some jQuery but i have not found any more information about how to achieve something like this.
it is a question out of pure interest because i really love the effect =)
it would be great if someone would give me a hint how to do something like that.
thanks in advance,
sebastian
It is indeed a nice effect. It's a bit of a combination of CSS and javascript really. I would use jQuery for sure. I've knocked up a little jsFiddle to show you how it can be done:
http://jsfiddle.net/SufZD/
I'm considering attempting a redesign of a flash website with jquery effects and transitions in place. I just wanted to reach out to the community to maybe see how feasible this really is considering the particular transitions and effects this website has.
Here's the link:
http://antonynicoli.com/english.html
The gallery I guess can be recreated by carousel plugin, but there are so many out there so maybe could suggest a stable one that would be be best suited to this job. The other items that really caught my attention in which I wouldn't really know where to start is the navbar and the effect that looks like a book opening when you click on a link on the navbar. Any and all input would be appreciated. Thanks.
This is probably doable, but I'm wondering about the motivations behind changing to an HTML/jQuery solution when it looks pretty good right now (as Brad pointed out above, it would require a total rework). I see a couple of things going on:
Carousel: jCarousel (http://sorgalla.com/jcarousel/) (never used it but it is popular)
Animations: jQuery Animate (http://api.jquery.com/animate/)
Other widgets/interactions: jQueryUI: (http://www.jqueryui.com)
Not sure how you would go about the open-book animation, but I suspect you could accomplish it with some clever jQuery animations.
The best way to see if it could be done is: start doing it! jQuery has tons of resources and you'll get good help here on StackOverflow.
After looking at the site i do believe most of the effects can be recreated fairly well using jQuery. Of course, your end-result might not be as smooth as the flash implementation but i think it can be done.
If you look at using HTML 5 i believe a lot of animations such as page transition with the opening book can be simulated with the canvas element. Same with the navigation elements.
https://developer.mozilla.org/en/canvas_tutorial
http://diveintohtml5.ep.io/canvas.html#divingin
As you mentioned some of the effects such as the carousel can be recycled from existing plugins. The only holdback really is how much time do you want to invest in porting a design to a language not as well suited to do the job. jQuery is an excellent framework but it is far from a drop-in replacement to create effects that are trivial to create in Flash/Actionscript.
the whole site can be done with jquery. all you have to do is map out all the animation done on the site and write it on paper. then look for the jquery alternatives online and check them off one by one. some things might not be exact but it will do the job.
I've found a feature on two different websites that I'd like to include on one of my web projects, but I can't figure out how they're doing it. I think they're using either jQuery or mootools, but I'm not sure.
http://www.x-plane.com/index_desktop.html
I'm new here so I don't have the reputation to post the other link, but if you do a Google search for "Andrews Institute of Orthopaedics" its the top result. I'll see if I can answer a few questions to earn my keep.
The thing that I like about these is that the images and text (including links) are all rotated together. I've done a few web searches related to cycle, rotate and slide but it's not coming together for me. Can anyone give me a nudge in the right direction?
The page you linked is using prototype for this (usually because that's what the author knew, as with most libraries), and it is custom script they've written. However, jQuery has a lot of plugins with various styles, just see what one fits your taste best. I'd suggest taking a look here and a look here.
Anything you find can be automated on a timer like the site you linked, or use buttons, or both. These are all pretty flexible, I'd start by finding the plugin you want, try and get it going, then asking a question here if you have problems getting it to behave exactly how you want.