For target to make sense, there would need to be content between the trigger and target. We do this using the roll-your-own method:
<div class="collapseomatic find-me" id="my_example" title="trigger text" data-offset="-60" data-findme="target">trigger text</div>
some bulky content. Notice the offset of -60, this is to compensate for the sticky menu element at the top of the page.
<div id="target-my_example" class="collapseomatic_content ">Target Content</div>
This is some bulky content… how about a picture of a donkey.
This is a demo of how to use a cookie to auto-collapse a expand element that is expanded by default. The idea is to set up an expand element this is expanded by default, but if a user collapses it once, it will no longer load auto-expanded for that user until the cookie expires.
For example the following expand element should be auto-expanded until it is manually collapsed. After this, the element will remain collapsed when the page is revisited.
Leo’s, being of a Fire sign, are heartfelt and passionate, being capable of expressing their feelings effortlessly and with transparency. Toward their beloved they […CLICK TO EXPAND] are giving, respectful, devoted and fun. They are strongly independent and driven, and so will try to be the dominate party of the relationship. The partner of a Leo may grow tired of being domineered, in particular if the Leo imposes their will upon matters that are not of their concern. In order to tolerate the Leo’s strong imposing will, the partner of a Leo needs to be learned and at an equivalent intellect. They also need to be willing to speak up for themselves and to defend their ground, else the blazing Sun of the Leo will scorch their personality.
The Leo’s sex life is dynamic, fun and adventurous. They are very aware of the fine line separating love and sex, which can cause them trouble within an established relationship if they too often neglect to show intimacy or connect emotionally with their partner during love making. Ultimately, Leo’s want that their partners peer past their self-centered shell and look deep into their subconscious sensitive core, so as to search out their want of satisfaction resulting from a purposeful relationship.
Leo Love Compatibility:Aries, Gemini, Libra, Sagittarius!
[CLICK TO HIDE]
This is a test where a scroll-to target will open an expand, however will then scroll back to the top of the page–or actually an element at the top of the page defined as: <h2='top'>Scroll Target at Top<H2>
Scroll Target at Top
This is just some filler text to move the expand item a bit further down the screen. In fact, why not just throw in an image and save us all a heap of blibber blabber text. Here is a photo of a donkey stuck in a manhole cover. Silly donkey, you are not a man… you’re a donkey.
Now we place an expand element with a defined ID and scrolltarget value: [expand title="trigger text" id="monkey" scrolltarget="#top"/]
This is some hidden text about a monkey in a bucket.
will scroll down to the monkey element, open it, then scroll back up to the top element. This bouncing around is quite annoying.
This is a test where we introduce a new attribute called hash_trigger. This is an secondary id that will be use to expand but not scroll to a collapse element based on the url anchor hash. For example. We create an expand element like so: [expand title="trigger text" id="smashing" hash_trigger="pumpkins"/]
This is some hidden text that will expand but not scroll to
Now when we link directly to the page with the url anchor hash of #smashing it will scroll to and expand the element above as normal. However, if we use the url anchor hash of #pumpkins it will only expand the element and NOT scroll anywhere , providing: 1. there is no other element with an ID of pumpkins 2. there is no scroll-to attribute defined on this expand element.
Note: to assign the hash_trigger using the roll-your-own method, simply assign a data-hash-trigger attribute to the trigger element: