Sorry your browser is not supported!

You are using an outdated browser that does not support modern web technologies, in order to use this site please update to a new browser.

Browsers supported include Chrome, FireFox, Safari, Opera, Internet Explorer 10+ or Microsoft Edge.

Geek Culture / Anyone a CSS guru?

Author
Message
Phaelax
DBPro Master
20
Years of Service
User Offline
Joined: 16th Apr 2003
Location: Metropia
Posted: 16th Sep 2016 05:39
I'm not sure this is even possible. Basically I want a collapsible div that expands when I click on something. And I want to do it without javascript if possible. Seems simple enough if the action was happening on the same component that triggers the event. But I can't figure out how to click one element but have a different element (another div) trigger, in this case, an animation to expand the div.

Made a quick example to work with.
https://jsfiddle.net/0qch31qy/1/


If it's not possible, I'll just have to use some cheap js.

"I like offending people, because I think people who get offended should be offended." - Linus Torvalds
CJB
Valued Member
20
Years of Service
User Offline
Joined: 10th Feb 2004
Location: Essex, UK
Posted: 16th Sep 2016 12:02
Is this what you want?

Replace

with


Uses the '+' adjacent sibling selector.
V2 T1 (Mostly)
Phone Tap!
Uzmadesign
Phaelax
DBPro Master
20
Years of Service
User Offline
Joined: 16th Apr 2003
Location: Metropia
Posted: 16th Sep 2016 15:11
I could've sworn I tried that! Maybe I used the wrong selector last night. But yea, thanks.

"I like offending people, because I think people who get offended should be offended." - Linus Torvalds
Phaelax
DBPro Master
20
Years of Service
User Offline
Joined: 16th Apr 2003
Location: Metropia
Posted: 22nd Sep 2016 00:15
Another question. I've tried several libraries and haven't quite found one that works flawlessly yet. I'm studying jquery to attempt my own solution.

Simply put, I want my mousedown action to act like that of a touchscreen. Click and drag the page to scroll (in my case a div element). The tricky part is not triggering click events if and only if I'm dragging the page.

Anyone know of a pre-existing library that can do this? Think of finger scrolling a page on your phone, that's what I want to mimic with the mouse. Why? Because the page I'm making is targeted at my tv with a wiimote type controller. Scroll bars are annoying with my remote.

"I like offending people, because I think people who get offended should be offended." - Linus Torvalds
CJB
Valued Member
20
Years of Service
User Offline
Joined: 10th Feb 2004
Location: Essex, UK
Posted: 22nd Sep 2016 17:25
You can prevent a click acting like a click in your div using jquery with something like this:



You'd need to add some extra code to only prevent the default click action when it is being dragged. Sounds like an interesting project you're working on
V2 T1 (Mostly)
Phone Tap!
Uzmadesign
Ortu
DBPro Master
16
Years of Service
User Offline
Joined: 21st Nov 2007
Location: Austin, TX
Posted: 23rd Sep 2016 02:32
Couple of suggestions here:

http://stackoverflow.com/questions/7894458/simulate-swipe-with-mouse-in-javascript


A single player RPG featuring a branching, player driven storyline of meaningful choices and multiple endings alongside challenging active combat and intelligent AI.
Phaelax
DBPro Master
20
Years of Service
User Offline
Joined: 16th Apr 2003
Location: Metropia
Posted: 28th Sep 2016 21:53 Edited at: 29th Sep 2016 03:25
Quote: "Sounds like an interesting project you're working on"

Well, if you're interested to know...

It's a netflix-like project for my own movie collection at home. My "smart" tv doesn't quite give a whole lot when it comes to browser my local media. Though it can, it's like using a dumbed down File Explorer. Apple TV you say? Costs money and it's one more thing to hook up to the tv. With any luck, I'll be able to host this right from my NAS (which I still need to see if I can with the model I have).

My first iteration of the site in progress. You can click the first two rows to show an example of the info expansion box.
http://zimnox.com/kissflix/index0.php

Current iteration and the current direction I'll probably take.
http://zimnox.com/kissflix/index.php

"I like offending people, because I think people who get offended should be offended." - Linus Torvalds

Login to post a reply

Server time is: 2024-03-28 20:29:48
Your offset time is: 2024-03-28 20:29:48