Another option is to use the dragstart actions to set a state tiddler,
which in turn is used to set a class around the droppable.
On Wednesday, January 20, 2021 at 12:52:27 PM UTC+1 Saq Imtiaz wrote:
> If the element isn't visible or doesn't have dimensions, it wont receive
> the dragover
>
> Try something like this: (untested code)
>
> \define OnDrop()
> <$some-actions-here/>
> \end
>
> <$list filter="[list[!!list]]" variable="list_item">
> <$draggable tiddler=<<list_item>>>
> <li><<list_item>></li>
> </$draggable>
> </$list>
>
> <div class="show-on-dragover-only">
> <$droppable actions=<<OnDrop>>><span>Drop here</span>
> </$droppable>
> </div>
>
> and
>
> .show-on-dragover-only > .tc-droppable > span {
> visibility: hidden;
> }
>
> .show-on-dragover-only > .tc-droppable.tc-dragover > span{
> visibility: visible;
> }
>
>
> On Wednesday, January 20, 2021 at 12:17:20 PM UTC+1 Hubert wrote:
>
>>
>> Hi,
>>
>> I'm trying to make a <div> only show when a draggable element is being
>> dragged.
>>
>> I have some list items and a div with the class "show-on-dragover-only"
>> below. That div should stay invisible (either through CSS or the <$reveal/>
>> mechanism) until the moment I started dragging any of the list items (the
>> sole action of *dragging *should be the trigger, not hovering over the
>> droppable element -- hovering is trivial with CSS pseudoclasses and that's
>> not what I'm looking for). I assume I have to somehow target the
>> .tc-dragover class but I could not make it work.
>>
>> Here's my minimal use case:
>>
>> \define OnDrop()
>> <$some-actions-here/>
>> \end
>>
>> <$list filter="[list[!!list]]" variable="list_item">
>> <$draggable tiddler=<<list_item>>>
>> <li><<list_item>></li>
>> </$draggable>
>> </$list>
>>
>> <div class="show-on-dragover-only">
>> <$droppable actions=<<OnDrop>>>
>> Drop here
>> </$droppable>
>> </div>
>>
>> And the CSS (which does not work):
>>
>> .show-on-dragover-only {
>> display: none;
>> }
>>
>> .show-on-dragover-only > .tc-droppable.tc-dragover div {
>> display: block;
>> }
>>
>> Thank you in advance for your hints.
>>
>> Regards,
>> Hubert
>>
>
--
You received this message because you are subscribed to the Google Groups
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To view this discussion on the web visit
https://groups.google.com/d/msgid/tiddlywiki/9854a53c-ad6b-4a06-b716-03ea18428becn%40googlegroups.com.
