Skip to content
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.

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

Focusing: focus/blur #282

Merged
merged 34 commits into from
Aug 16, 2023
Merged
Changes from 1 commit
Commits
Show all changes
34 commits
Select commit Hold shift + click to select a range
259707b
Update article.md
shahrzadJavadiKoushesh Aug 7, 2023
14d4945
Update article.md
shahrzadJavadiKoushesh Aug 7, 2023
c9f0f84
Update article.md
shahrzadJavadiKoushesh Aug 7, 2023
27c60a9
Update article.md
shahrzadJavadiKoushesh Aug 7, 2023
840c88d
Update article.md
shahrzadJavadiKoushesh Aug 7, 2023
dce6b0d
Update article.md
shahrzadJavadiKoushesh Aug 7, 2023
be3c4c4
Update article.md
shahrzadJavadiKoushesh Aug 7, 2023
6ca9e97
Update article.md
shahrzadJavadiKoushesh Aug 7, 2023
853c973
Update article.md
shahrzadJavadiKoushesh Aug 7, 2023
d0167c6
Update article.md
shahrzadJavadiKoushesh Aug 7, 2023
259fc00
Update article.md
shahrzadJavadiKoushesh Aug 9, 2023
cb1e4e0
Update article.md
shahrzadJavadiKoushesh Aug 9, 2023
1b3128d
Update article.md
shahrzadJavadiKoushesh Aug 10, 2023
2b34867
Update article.md
shahrzadJavadiKoushesh Aug 11, 2023
a074ed2
Update article.md
shahrzadJavadiKoushesh Aug 11, 2023
747efb0
Update article.md
shahrzadJavadiKoushesh Aug 11, 2023
6a6e6d9
Update article.md
shahrzadJavadiKoushesh Aug 11, 2023
52cd9fc
Update article.md
shahrzadJavadiKoushesh Aug 11, 2023
99e31a7
Update article.md
shahrzadJavadiKoushesh Aug 11, 2023
8c516c2
Update article.md
shahrzadJavadiKoushesh Aug 11, 2023
7daec88
Update article.md
shahrzadJavadiKoushesh Aug 11, 2023
36fd6b7
Update article.md
shahrzadJavadiKoushesh Aug 11, 2023
49a483a
Update solution.md
shahrzadJavadiKoushesh Aug 12, 2023
d76b628
Update solution.md
shahrzadJavadiKoushesh Aug 12, 2023
eba88f5
Update task.md
shahrzadJavadiKoushesh Aug 12, 2023
75466a1
Update solution.md
shahrzadJavadiKoushesh Aug 12, 2023
6bd26a3
Update task.md
shahrzadJavadiKoushesh Aug 12, 2023
8d7ed09
Update task.md
shahrzadJavadiKoushesh Aug 13, 2023
aa41f27
Update task.md
shahrzadJavadiKoushesh Aug 14, 2023
b68bdfb
Update solution.md
shahrzadJavadiKoushesh Aug 14, 2023
2ce6f28
Update task.md
shahrzadJavadiKoushesh Aug 14, 2023
85f1072
Update article.md
shahrzadJavadiKoushesh Aug 14, 2023
be54b43
Update article.md
shahrzadJavadiKoushesh Aug 16, 2023
70fdf91
fix: remove an additional line
mahdiHash Aug 16, 2023
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
Prev Previous commit
Next Next commit
Update article.md
  • Loading branch information
shahrzadJavadiKoushesh committed Aug 11, 2023
commit 6a6e6d97073b56e735d61d38a81dd1a2e020ff2e
14 changes: 8 additions & 6 deletions 2-ui/4-forms-controls/2-focus-blur/article.md
Original file line number Diff line number Diff line change
Expand Up @@ -152,18 +152,20 @@

ترتیب به این صورت است: `1 - 2 - 0`. به طور نرمال، `<li>` از focus پشتیبانی نمی‌کند اما `tabindex` آن را به همراه eventها و style دادن با `:focus` مهیا می‌کند.

```smart header="The property `elem.tabIndex` works too"
We can add `tabindex` from JavaScript by using the `elem.tabIndex` property. That has the same effect.
```smart header="هم کار می‌کند. `elem.tabIndex`"

ما می‌توانیم `tabindex`از JavaScript را با استفاده از `elem.tabIndex` اضافه کنیم. آن هم اثر یکسان را دارد

```

## Delegation: focusin/focusout

Events `focus` and `blur` do not bubble.

For instance, we can't put `onfocus` on the `<form>` to highlight it, like this:
.وجود ندارد `blur` و `focus` رفتار بالا رفتن حبابی در
mahdiHash marked this conversation as resolved.
Show resolved Hide resolved
کنیم، مثل این highlight بگذاریم تا آن را `<form>` را روی `onfocus` برای مثال ما نمی‌توانیم

```html autorun height=80
<!-- on focusing in the form -- add the class -->
<!-- را اضافه کنید class -- روی فرم focus در مورد -->

<form *!*onfocus="this.className='focused'"*/!*>
<input type="text" name="name" value="Name">
<input type="text" name="surname" value="Surname">
Expand Down