Web Design HTML CSS

...to answer my own question from two posts above - actually it's very easy, vimeo handles this basically the same way youTube does -
you can just append a little time code to the end of the video-url, and the movie will play from there;
like, if you append t=2m11s? it will start a 02:11 - that's it.

Another quick question though - I'm too thick for CSS, so maybe somebody in the know can help -
please see this tumblr: tinakinodiarya.tumblr.com
..as you can see this displays images in a row, one after the other.
What I want is to change this, so that there's two rows, two images next to each other.

Any help appreciated!

The question is quick but the explanation can be too long…

I don't know tumblr and which options gives you, anyway in CSS that is usually made with the img{float:left;} to stop the floating img{clear:both;}

Or you can have two divs and assign the float to the divs.

Actually, after analysing the code i think you should add to:

div.posts {
margin-left: 200px;
margin-top: 100px;
width: 500px;
}

with:

div.posts {
margin-left: 200px;
margin-top: 100px;
width: 500px;
float: left;
}

From static it will became fluid… two or more column…

PS with a bit of luck we are gonna keep the caption where it is…

If you can tweak the css (not sure you will have access to that) you'd also need to change the width to around 1200px or so, as some of your pix are almost 600px wide.

Here something for the CSS gurus, I'm trying on stack overflow but not success so far, I post their link, it's quicker.

http://stackoverflow.com/questions/30662788/why-the-slider-image-is-not-responsive

Your images are set at 100% width, but 100% of what?
The nearest parent with set dimensions is the #container div.school ul.gallery li which is fixed at 800px.

If it's any consolation user testing consistently shows that carousels are terrible for user retention. Nobody goes past the 1st image :-)

Maybe read this http://sorgalla.com/jcarousel/docs/cookbook/responsive-carousel.html

It's a totally different one, if I could I would have just changed the slider and the problem was solved. I need to transform that in a responsive one, that's the task…

BTW, I already tried on the img
display: block;

max-width: 100%;
height: auto !important;

But nope! :)

Yep, I changed the parent ul li in
width: 100%;
max-width:800px;

but nope, so I went to the ul and changed that bloody 20000em width, and then the responsiveness works, but the slider gets totally fucked.
No slider anymore, all images gets displayed out.

This is a task given to me as a test, I have to change the semantics, make the page from static to responsive, and add a lightbox. It's all done apart that fucking slider. So frustrating, I'm not even sure that it's possible. I just hope it's not a sort of trick just to test me…

Maybe read the documentation for the jquery plugin you are using.

http://sorgalla.com/jcarousel
http://s1.city.ac.uk/developer-assessment-2015/js/jquery.jcarousel.min.js

Which leads you to this page - the options for your jcarousel
http://testdesign.co.uk/js/script.js

Thank you, Dave. But I can't solve.

I downloaded the entire package from GitHub, and I have open the only one responsivish.

I managed to match the CSS but doesn't work, it has a tiny bit different HTML and a quite different Js, changing all would be to change the slider… which is something that I would have done already 20 hours ago.

If I find out something interesting or the solution I will post it.

DONE!

/crossposted from the design wankerz thread

next question: i have a css / bootstarp behavior issue that's rustling my jimmies for a private job i'm reluctantly having to do. all i want is a bog standard image swap OnScrollDown (logo gets replaced with just a shape in the header) / reverse on scroll up. i'm not a fucking web coder/designer.

http://russjohnson.co.uk/paul/

is there a thread for this sort of shit?

Got some spinny testimonial type things to do on a site I'm tinkering with but the spin is way too frequent for the length of time it takes to read them. Have adjusted aos duration but doesn't seem to do a lot. The .scss for that element doesn't include anything like duration/delay - just dimensions/borders/fonts etc.

  <div class="container-fluid testimonials-wrapper"
             data-aos="fade-up"
             data-aos-delay="200"
             data-aos-anchor-placement="top-bottom"
             data-aos-easing="ease-in-quad"
             data-aos-duration="800">
            <div class="swiper-container swiper-testimonials">

From a quick google it looks like data-aos-duration should do it, try setting it to something very different like 10000 and see if it's showing a change

@Sumo Thanks - that's what I figured but I tried setting it to 55000 and seems unaffected. I'm wondering if it's duplicated somewhere else in a maze of folders. Currently I'm only editing index.html

Right click on the element, select Inspect and see if anything is putting a transition timing or if there's a transition option with an amount of milliseconds

Ugh - did that and can of worms opened. Seems like I might be able to figure it out via there but trying to juggle toddler and cook so will take a look again tomorrow eve. Cheers for the Inspect reminder. Always forget.

Is it online somewhere I can take a look?

https://github.com/michalsnik/aos
Perhaps this might help.

https://github.com/michalsnik/aos#setting-duration-delay
This section in particular may shed some light

Thanks both - somehow missed these replies. That end of things is sorted now thankfully.

Now I'm looking for some kind of carousel that can open like an accordion/concertina style animation.

So I cycle left and right through some cards and when I click on a card it animates open horizontally to fill up the section (and you can close the card or cycle through via arrows when it's open). Is there a better way to explain that or an example I can show to the alleged dev I've foolishly hired on PPH who seemingly isn't much more knowledgable than me.

In his defense, the only accordion type things I can find examples of are drop-downs featuring text like this: https://vctrfrnndz.github.io/jquery-accordion/
I want something to open left-to-right and reveal a grid of images (maybe including motion gifs) and some text. That should be possible, right?

Changed search terms and found some better examples. Still not what I had in mind exactly but one of them will do to finish this project so I can use it as a proof of concept and hopefully get some budget to do properly.

https://codepen.io/stefcharle/pen/Gydvbx
https://codepen.io/bbx/pen/Jxoqdg
https://codepen.io/emoreno911/pen/dOveoY
https://codepen.io/arjancodes/pen/gbweYB

Often codrops (https://tympanus.net/codrops/) have lots of these kinds of examples, might be worth a rummage there?