Skip to content

Mouse events #149

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 6 commits into from
Sep 11, 2021
Merged

Mouse events #149

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
255c30a
mouse-event-basics
erfanyeganegi Sep 10, 2021
18e169c
Update index.html
erfanyeganegi Sep 10, 2021
7927eae
Revert "mouse-event-basics"
erfanyeganegi Sep 10, 2021
65a7114
Update article.md
erfanyeganegi Sep 10, 2021
550e42c
requested changes done
erfanyeganegi Sep 10, 2021
eb4714f
Update article.md
erfanyeganegi Sep 10, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
14 changes: 7 additions & 7 deletions 2-ui/3-event-details/1-mouse-events-basics/01-selectable-list/solution.view/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,15 +16,15 @@

<body>

Click on a list item to select it.
روی یک آیتم کلیک کنید تا انتخاب شود.
<br>

<ul id="ul">
<li>Christopher Robin</li>
<li>Winnie-the-Pooh</li>
<li>Tigger</li>
<li>Kanga</li>
<li>Rabbit. Just rabbit.</li>
<li>کریستوفر رابین</li>
<li>وینی د پو</li>
<li>ببری</li>
<li>کانگا</li>
<li>خرگوش. فقط خرگوش</li>
</ul>

<script>
Expand All @@ -39,7 +39,7 @@

}

// prevent unneeded selection of list elements on clicks
// جلوگیری از انتخاب غیرضروری آیتم‌ها هنگام کلیک
ul.onmousedown = function() {
return false;
};
Expand Down
14 changes: 7 additions & 7 deletions 2-ui/3-event-details/1-mouse-events-basics/01-selectable-list/source.view/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,19 +16,19 @@

<body>

Click on a list item to select it.
روی یک آیتم کلیک کنید تا انتخاب شود.
<br>

<ul id="ul">
<li>Christopher Robin</li>
<li>Winnie-the-Pooh</li>
<li>Tigger</li>
<li>Kanga</li>
<li>Rabbit. Just rabbit.</li>
<li>کریستوفر رابین</li>
<li>وینی د پو</li>
<li>ببری</li>
<li>کانگا</li>
<li>خرگوش. فقط خرگوش</li>
</ul>

<script>
// ...your code...
// ...کد شما...
</script>

</body>
Expand Down
14 changes: 7 additions & 7 deletions 2-ui/3-event-details/1-mouse-events-basics/01-selectable-list/task.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,17 +2,17 @@ importance: 5

---

# Selectable list
# لیست قابل انتخاب

Create a list where elements are selectable, like in file-managers.
یک لیست بسازید که عناصر آن قابل انتخاب باشند، مانند اپلیکیشن‌های مدیریت فایل.

- A click on a list element selects only that element (adds the class `.selected`), deselects all others.
- If a click is made with `key:Ctrl` (`key:Cmd` for Mac), then the selection is toggled on the element, but other elements are not modified.
- کلیک روی عنصر لیست فقط آن عنصر را انتخاب می‌کند. (کلاس `.selected` را اضافه کند)، بقیه عناصر باید لغو انتخاب شوند.
- اگر که کلیک همراه با `key:Ctrl` (`key:Cmd` برای مک) باشد، پس عمل انتخاب یا لغو انتخاب فقط برای آن عنصر عمل کند، درحالی که بقیه عنصرها تغییری نکنند.

The demo:
دمو:

[iframe border="1" src="solution" height=180]

P.S. For this task we can assume that list items are text-only. No nested tags.
پی‌نوشت: برای این تکلیف می‌توانیم در نظر بگیریم که آیتم‌های داخل لیست فقط متن هستند، و نه تگ‌های تو در تو.

P.P.S. Prevent the native browser selection of the text on clicks.
پی‌نوشت: از رفتار پیش‌فرض مرورگر که باعث انتخاب متن هنگام کلیک کردن می‌شود جلوگیری کنید.
Loading