first of all, thanks in advance for looking at this piece of jquery. This jquery piece should fold out three pictures only to the right, which is working perfectly. Thing is that because of the hover, it's building up a queue and when you hover over it three times or something like that, it doesn't slide back on mouseleave, but it stays slided out, because of this queue... I was told to add a stop function... So I tried...but it doesn't really work... I'm really an amateur on jquery, so it might be a really easy sollution
This is my jquery:
<script type="text/javascript">
$(document).ready(function(){
$('.slideout').hover(function() {
if ( ! $(this).hasClass('foldedOut') ) {
$(this).animate({
width: "1089px",
}, 1000, '', function() {
$(this).addClass('foldedOut');
updateFoldedOutClickFunctions();
});
}
});
});
function updateFoldedOutClickFunctions () {
$('.foldedOut').hover(function() {
if ( $(this).hasClass('foldedOut') ) {
var parentID = $(this).parent().attr('id');
var idx = $('#'+parentID).children('.slideout').index(this);
for my website I inserted a piece of jquery, which is working for three lines to fold out. On the first click they fold out and on a second click they close... So that's all perfect... Thing is that they get all three folded out 350px, but I would like them to have a seperate amount of px. For example: The first picture folds out 200 px, the second 300 and the thirth 1500 px.
How can I do this, with this piece of jquery??
<script type="text/javascript">
$(document).ready(function(){
$('.sliderout').click(function() {
if ( ! $(this).hasClass('foldedOut') ) {
$(this).animate({
width: "350px",
}, 1000, '', function() {
$(this).addClass('foldedOut');
updateFoldedOutClickFunctions();
});
}
});
});
function updateFoldedOutClickFunctions () {
$('.foldedOut').click(function() {
if ( $(this).hasClass('foldedOut') ) {
var parentID = $(this).parent().attr('id');
var idx = $('#'+parentID).children('.sliderout').index(this);
On this homepage website, I have three big pictures, which fold out on a hover... so basically a big part of the image is hidden and at a mouse hover it get's visible....
Thing is... I get these ugly scrollbars in my images when they fold out... I tried to get rid of them, but so far without any succes...
I'm a bit of a rooky on the field of building websites...so maybe this solution is very easy to solve... I hope...
I have to say, that I am a beginner at the field of website building, but I'm kind of managing. The thing is that I have a problem with three lines I want to fold out 'on click' and close them 'onclick'. Now they are opening on hover, but I want them to stay open, so the website visitor can actually look at them for quite a while to read the text or examine a drawing.
I tried to do something with tabs or pull out div's, but none of them work. Here I inserted my script, with some jquery about toggle, but I don't think that will be the solution....
<p>The location for this particular design was situated in the middle of the IJsselmeer on a dike, which is surrounding a siltdepot. On the one side of the dike a 'clean' lake and on the other side a circular lake to store contaminated mud.
The assignment was to design a museum, a building which would make people aware of the pollution at this particularly place, but also in the rest of the world. Aside from making people aware of pollution through the exposition, which is partly about the siltdepot, also the design of the building could transform this museum in a tool, showing the pollution of the world to visitors.
When a visitor arrives at the pavillion by boat, first thing he does is climbing upon the dike and walking on it for a few meters, before entering the pavillion. This is his first encounter with the contradiction between 'clean' and dirty and contaminated. When this visitor is inside he can start his journey through the building. The building is designed in a way, that a visitor can only go up, through a staircase winding around an elevator. On each floor there is a different theme or exposition and on each floor the visitor is learning more and more about this siltdepot. At the upper floor there is suddenly a junction and the visitor is forced to make a choice: left or right. When he chooses to go left he will go up a stairs which is leading to one of the two viewpoints. He will see in this case the siltdepot. In the case that he chooses right, he will also climb a stairs before reaching the viewpoint with a view over the 'clean' IJsselmeer. This is the second and strongest confrontation the visitor has with the contradicition between clean and polluted.