1044

මා සතුව සීඑස්එස් කේතය ලිවිය යුතු අවස්ථාවක් තිබේ, මට නැංගුරමක හෝවර් ශෛලියක් යෙදීමට අවශ්‍යය.

a:hoverHTML විලාසිතාවේ ගුණාංගය තුළ පේළිගත CSS භාවිතා කරන්නේ කෙසේද?

උදා: ඔබට HTML ඊමේල් වල CSS පන්ති විශ්වාසදායක ලෙස භාවිතා කළ නොහැක.

html css inline-styles

24

HTML බ්ලොග්කරණ යෙදුම් වලට කාවැද්දීම සඳහා බොහෝ විට පේළිගත කිරීමේ මෝස්තර භාවිතා කිරීම අවශ්‍ය වේ. විශේෂයෙන් ඔබ තෙවන පාර්ශවීය සේවාදායකයකු හරහා html කාවැද්දුවහොත් සහ පරිශීලකයාගේ තේමාවන් වෙත ප්‍රවේශයක් නොමැති නම්.

— Providence

8

මේ සඳහා යෝජිත CSS ප්‍රමිතියක් ඇත; එයට කුමන ආකාරයේ බ්‍රව්සර් සහය තිබිය හැකිදැයි නොදැන (ඉඟිය: ඔවුන් -moz වැනි අභිරුචි ටැග් භාවිතා කළ හැකිය): w3.org/TR/2002/WD-css-style-attr-20020515

— කැටෝ

1

විය හැකි අනුපිටපතක් පේළිගත ව්‍යාජ මෝස්තර නිර්මාණය කළ හැකිද?

— සයිනෙටෙක්

17

අපෝ මොකක්ද අනේ. සමහර විට ඔබ ගොඩබෑමේ පිටු මූලාකෘතියක් ගොඩනඟමින් සිටින අතර, ඔබට මෝස්තර පත්‍රිකා දෙබස් කිරීමට හෝ නව අච්චු ශාඛාවක් හෝ හරිත බොත්තම වඩා හොඳින් ක්‍රියාත්මක වේදැයි පරීක්ෂා කිරීමට අවශ්‍ය නැත. ෂීෂ්.

— එල්බෙල්

1

PageFriendlyNeighborhoodIdiot මෙම පිටුව අවුරුදු 13 ක් පැරණි බැවින් කෙටුම්පත අතහැර දමා ඇත.

— ටොෆැන්ඩෙල්

588

කෙටි පිළිතුර: ඔබට බැහැ.

දිගු පිළිතුර: ඔබ නොකළ යුතුය.

එයට පන්ති නාමයක් හෝ හැඳුනුම්පතක් ලබා දී ශෛලිය යෙදීම සඳහා ස්ටයිල් ෂීට් භාවිතා කරන්න.

:hoverව්‍යාජ තේරීම් කාරකයක් වන අතර, CSS සඳහා අර්ථය ඇත්තේ මෝස්තර පත්‍රය තුළ පමණි. පේළිගත ශෛලියට සමාන කිසිවක් නොමැත (එය තේරීමේ නිර්ණායක නිර්වචනය නොකරන බැවින්).

OP හි අදහස් වලට ප්‍රතිචාර:

CSS නීති ගතිකව එකතු කිරීම පිළිබඳ හොඳ පිටපතක් සඳහා ජාවාස්ක්‍රිප්ට් සමඟ සම්පුර්ණයෙන්ම Pwn CSS බලන්න . ස්ටයිල් ෂීට් වෙනස් කිරීමද බලන්නවිෂය පිළිබඳ සමහර න්‍යායන් සඳහා .

එසේම, අමතක නොකරන්න, ඔබට විකල්පයක් නම් බාහිර මෝස්තර සඳහා සබැඳි එක් කළ හැකිය. උදාහරණයක් වශයෙන්,

<script type="text/javascript">
  var link = document.createElement("link");
  link.setAttribute("rel","stylesheet");
  link.setAttribute("href","http://wherever.com/yourstylesheet.css");
  var head = document.getElementsByTagName("head")[0];
  head.appendChild(link);
</script>

අවවාදයයි: ඉහත උපකල්පනය කරන්නේ ප්‍රධාන අංශයක් ඇති බවයි.

— ජොනතන් ෆින්ග්ලන්ඩ්
source

4

ඔබට javascript හි css පන්ති එකතු කළ හැකිය

— ජොනතන් ෆින්ග්ලන්ඩ්

212

HTML ඊමේල් වැනි එකම විකල්පය පේළිගත CSS වන වෙනත් අවස්ථා තිබේ (උදා: Gmail CSS නොසලකා හරිනුයේ එය පේළිගත නොවන්නේ නම්). අවාසනාවකට මෙන් බොහෝ විද්‍යුත් තැපැල් සේවාදායකයින් තුළ ජාවාස්ක්‍රිප්ට් ඉවත් කර ඇති අතර මම තවම එකතු කිරීමේ ක්‍රමයක් සොයාගෙන නැත: හෝවර් ප්‍රයෝග.

— සයිමන් ඊස්ට්

26

At කැටෝ එය හොඳ සබැඳියක් වන අතර, එය සාර්ථක වනු ඇතැයි මම ප්‍රාර්ථනා කරමි. සනාථ කිරීම සඳහා, මම සින්ටැක්ස් භාවිතයෙන් පරීක්‍ෂා කළ style="{color:green;} :hover { color: red; }"අතර ෆයර්ෆොක්ස් සබැඳිය කොළ පාට කිරීමට සමත් වූ නමුත් එය නොසලකා හැරියෙමි. Chrome දෙකම නොසලකා හැරියේය. අඛණ්ඩව පරීක්ෂා කිරීම අර්ථ විරහිත වනු ඇත.

— ජොනතන් ෆින්ග්ලන්ඩ්

9

මම එය ක්‍රියාකාරී විසඳුමක් ලෙස ප්‍රකාශ කළේ නැත. පේළිගත කිරීම් හා සමාන නොවන බව පැවසීම “මුළුමනින්ම” නිවැරදි නොවන බවත් ව්‍යාජ තේරීම් කරුවන්ට මෝස්තර රටාවෙන් පිටත අර්ථයක් නොමැති බවත් මම ප්‍රකාශ කළෙමි. එය නුසුදුසු වන්නේ කෙසේද?

— කැටෝ

5

දිගු පිළිතුර වන්නේ ඇයි ඔබ නොකළ යුතු ... ඔබ ... ඔබ, සාමාන්යකරණයක් කළ යුතු නැහැ. මම උත්සාහ කළේ html සමඟ විද්‍යුත් තැපැල් පණිවිඩ යැවීමටයි, නමුත් අනුමාන කරන්න ... gmail සියළුම විලාසිතාවේ ටැග්, සියලු බාහිර ශෛලීය යොමු කිරීම් සහ සියලුම ස්ක්‍රිප්ට් ඉවත් කරයි. ඉතින් ... ජීමේල් වෙත යවන ඊමේල් තුළ ඇති සබැඳි වල වර්ණය සැරිසැරීමට ක්‍රමයක් තිබේද? බලාපොරොත්තු වෙනවා ... බලාපොරොත්තුව තමයි අන්තිමයා මැරෙන්නේ !!! =)

— මිගෙල් ඇන්ජලෝ

454

මූලද්‍රව්‍ය එකකට වඩා වෙනස් කිරීමට අවශ්‍ය නම් එය අතිශයින්ම අකාර්යක්ෂම වුවද, onMouseOverසහ onMouseOutපරාමිතීන්හි ජාවාස්ක්‍රිප්ට් සමඟ ඔබේ මෝස්තර වෙනස් කිරීමෙන් ඔබට එකම බලපෑමක් ලබා ගත හැකිය :

<a href="abc.html"
   onMouseOver="this.style.color='#0F0'"
   onMouseOut="this.style.color='#00F'" >Text</a>

ස්නිපටය පුළුල් කරන්න

එසේම, thisමෙම සන්දර්භය තුළ ක්‍රියාත්මක වේදැයි මට නිශ්චිතව මතක නැත . ඔබට එය මාරු කිරීමට සිදු විය හැකිය document.getElementById('idForLink').

— ඇලෙක්ස් එස්
source

14

ඒක දක්ෂයි! පසුබිම් වර්ණ <div onMouseOver="this.style.backgroundColor='#F8F8F8'" onMouseOut="this.style.backgroundColor='#FFFFFF'"> ...

— සංචලනය සඳහා

46

මෙය 'දක්ෂ' ලෙස දැකීම ගැන සිනාසීමට සිදුවේ :) ඔබට මෙම බලපෑම ලබා ගත හැකි ප්‍රමුඛ / එකම ක්‍රමය මෙය වන විට සමහර අය නොසිටියේ යැයි සිතීම දුෂ්කර ය. හෝ ඊටත් වඩා නරක නම්, 'රූපයක්' තිබීම සහ රූපය මාරු කිරීම, 'හෝවර්' ආචරණය ලබා දීම සඳහා ය. මට මහලු බවක් දැනේ! නමුත් පැවසීමට සෑහේ, එය OP හි ප්‍රශ්නයට පිළිතුරු සපයයි :)

— Manachi

5

මට මේ ගැන මනාචි සමඟ එකඟ විය යුතුයි. මෙය 90 දශකයේ භූ-ජාවාස්ක්‍රිප්ට් වෙත ෆ්ලෑෂ්බැක් වැනි ය; පී

— එරික් කැස්ත්‍රෝ

10

පැරණි, නව, පුරාණ හෝ ඉදිරියෙන්. එය ප්‍රශ්නයට පිළිතුරු දුන් අතර මට උදව් විය. ස්තූතියි, පීටර්.

— user2060451

4

මට විද්‍යුත් තැපෑලක් සඳහා මෙය කිරීමට අවශ්‍ය වූ අතර එය ක්‍රියාත්මක විය. ඔබට ස්තුතියි! පිළිගත් පිළිතුර මෙන් නොව මෙය සැබවින්ම ප්‍රශ්නය විසඳයි.

— TheUtherSide

54

අතීතයේ යම් අවස්ථාවක දී ඔබට එය කළ හැකිය . නමුත් දැන් (අපේක්ෂක නිර්දේශය වන එකම ප්‍රමිතියේ නවතම සංශෝධනයට අනුව) ඔබට බැහැ.

— ෆුඩින්
source

3

අනෙක් සියලුම පිළිතුරු පැවසුවේ එය කළ නොහැකි බවයි, නමුත් ඔබේ පිළිතුර එය කළ හැකි බව පෙන්වයි, ඔබේ පිළිතුර වෙනස් ය, මම එය පරීක්ෂා කරමි.

— අම්ර් එල්ගරි

2

කණගාටුයි, මම ලිපියේ දිනය පරීක්ෂා කළෙමි. එහි වයස අවුරුදු 10 කි. එබැවින් එය ක්‍රියාත්මක විය යුතු බවට සහතිකයක් නොමැත. එය එසේ නම්, කරුණාකර මටත් කියන්න.

— ෆුඩින්

2

මම මෙය අත්හදා බැලුවෙමි:

<a href="http://www.w3.org/"           style="{color: #900}           :link {background: #ff0}           :visited {background: #fff}           :hover {outline: thin red solid}           :active {background: #00f}">...</a>

නමුත් එය ක්‍රියාත්මක වූයේ නැත

— අම්ර් එල්ගරි

5

යමෙකුට මෙම පිළිතුර හමු වුවහොත්, පිළිතුරු සපයන්නා

— BoltClock

9

වඩාත් නිවැරදිව කිවහොත්, ඔබට අතීතයේ යම් අවස්ථාවක දී එය කළ හැකිය . නමුත් දැන් (අපේක්ෂකයාගේ නිර්දේශය වන එකම ප්‍රමිතියේ නවතම සංශෝධනයට අනුව) ඔබට බැහැ .

— ඉල්යා ස්ට්‍රෙල්ට්සින්

38

මම මේ සඳහා අතිශයින් ප්‍රමාද වී සිටිමි, කෙසේ වෙතත් කිසිවෙකු මෙය යෝජනා නොකිරීම ගැන මම කනගාටු වෙමි, ඔබට ඇත්ත වශයෙන්ම පේළිගත කේතයක් අවශ්‍ය නම් මෙය කළ හැකිය. සමහර හොවර් බොත්තම් සඳහා මට එය අවශ්‍ය විය, ක්‍රමය මෙයයි:

.hover-item {
	background-color: #FFF;
}

.hover-item:hover {
	background-color: inherit;
}

<a style="background-color: red;">
	<div class="hover-item">
		Content
	</div>
</a

ස්නිපටය පුළුල් කරන්න

මෙම අවස්ථාවේ දී, පේළිගත කේතය: "පසුබිම්-වර්ණය: රතු;" හෝවර් මත ස්විච් වර්ණය, ඔබට අවශ්‍ය වර්ණය එහි දමා මෙම විසඳුම ක්‍රියාත්මක වේ. ගැළපුම අනුව මෙය පරිපූර්ණ විසඳුමක් නොවන බව මම තේරුම් ගතිමි.

— lukesrw
source

4

ඔබට ස්තුතියි. එය විශිෂ්ට පිළිතුරකි, මෙම පිළිතුර විසඳුමක් විය යුතු යැයි මම සිතමි.

— හොවාන්නස් සර්ග්ස්යාන්

67

නැත, OP කියා සිටියේ HTML ශෛලීය ගුණාංගය තුළ පේළිගත CSS තුළ එය අවශ්‍ය බවයි .

— jj_

3

මම දනිමි, jj_- කෙසේ වෙතත් මෙම ක්‍රමය මඟින් ඔබට CSS වෙත පේළි කිහිපයක් පමණක් දමා බොහෝ ස්ථානවල නැවත නැවතත් භාවිතා කිරීමට ඉඩ ලබා දේ, බොහෝ අය (මා ද ඇතුළුව) මෙය ප්‍රයෝජනවත් විකල්පයක් බව සොයාගෙන ඇත.

— lukesrw

2

සුළු වෙනස් කිරීමකින් මෙය සත්‍ය පිළිතුර විය යුතුය: ශෛලිය තුළ කිසිදු වර්ණයක් සකසන්න එපා, මවුපියන්ගෙන් උරුම වූ විට ඇති වන රීතිය පමණක් වන අතර ඉන්පසු වර්ණ දෙක පේළිගත කරන්න.

— හේකෝ කෝරියන්

4

මෙය කළ හැකි “සාමාන්‍ය” ක්‍රමය පමණක් වන අතර, සෑම කෙනෙකුම නිවැරදි මාර්ගය යැයි පැවසූහ. කෙසේ වෙතත් එය OP මුල් ඉල්ලීම වූ පේළිගත ක්‍රමයක් නොවේ.

— wcndave

33

ඔබ විස්තර කරන දේ හරියටම කළ නොහැක, මන්ද a:hoverතේරීම් කාරකයේ කොටසක් මිස CSS නීති නොවේ. මෝස්තර පත්‍රිකාවට සංරචක දෙකක් ඇත:

selector {rules}

පේළිගත මෝස්තරවලට ඇත්තේ නීති පමණි; තේරීම් කාරකය වත්මන් අංගය ලෙස ගම්‍ය වේ.

තේරීම් කාරකය යනු එක්ස්එම්එල් වැනි ලේඛනයක මූලද්‍රව්‍යයන්ට ගැලපෙන නිර්ණායක සමූහයක් විස්තර කරන ප්‍රකාශන භාෂාවකි.

කෙසේ වෙතත්, ඔබට සමීප විය හැකිය, මන්ද styleකට්ටලයක් තාක්‍ෂණිකව ඕනෑම තැනකට යා හැකි බැවිනි :

<html>
  <style>
    #uniqueid:hover {do:something;}
  </style>
  <a id="uniqueid">hello</a>
</html>

— රෙක්ස් එම්
source

3

ඇත්ත වශයෙන්ම ඔබට මෙය කළ නොහැක: “ලේඛනයක HEAD කොටසේ ඇති ඕනෑම STYLE අංග ගණනකට HTML අවසර දෙයි.” ( W3.org/TR/html4/present/styles.html#edef-STYLE )

— එරික් Araujo

3

මගේ යන්ත්‍රය මත ක්‍රියා කරයි. ස්තූතියි!

— ජොෂ් හබ්දාස්

É ÉricAraujo: ඉන්පසු මේ සියලු අන්තර්ගතයන් <html> </html>ටැගයක් යටතේ

— ඔතා තබන්න

30

Javascript භාවිතා කරමින්:

අ) පේළිගත ශෛලිය එක් කිරීම

document.head.insertAdjacentHTML('beforeend', '<style>#mydiv:hover{color:red;}</style>');

b) හෝ ටිකක් අමාරු ක්‍රමයක් - "මූසිකය" එකතු කිරීම

document.getElementById("mydiv").onmouseover= function(e){this.className += ' my-special-class'; };
document.getElementById("mydiv").onmouseleave= function(e){this.className = this.className.replace('my-special-class',''); };

සටහන: font-sizeජාවාස්ක්‍රිප්ට් හි බහු වචන ශෛලීන් (එනම් ) එකට ලියා ඇත :

element.style.fontSize="12px"

— ටී
source

3

මෙම පිළිතුර සංස්කරණය කර ඇති බැවින්, එය දැන් මුල් ප්‍රශ්නයට සම්පූර්ණයෙන්ම අදාල නොවන බව පෙනේ ...

— බිල්

1

ඇවැත්නි, එය පෙට්ටියෙන් පිටත සිතයි ... මම එයට කැමතියි!

— theglossy1

14

හොඳම කේත උදාහරණය මෙයයි:

<a
 style="color:blue;text-decoration: underline;background: white;"
 href="http://aashwin.com/index.php/education/library/"
 onmouseover="this.style.color='#0F0'"
 onmouseout="this.style.color='#00F'">
   Library
</a>

ස්නිපටය පුළුල් කරන්න

උපපරිපාලක වරු යෝජනාව: ඔබගේ උත්සුකයන් වෙන් කර තබා ගන්න.

HTML

<a
 style="color:blue;text-decoration: underline;background: white;"
 href="http://aashwin.com/index.php/education/library/"
 class="lib-link">
   Library
</a>

ස්නිපටය පුළුල් කරන්න

ජේ

const libLink = document.getElementsByClassName("lib-link")[0];
// The array 0 assumes there is only one of these links,
// you would have to loop or use event delegation for multiples
// but we won't go into that here
libLink.onmouseover = function () {
  this.style.color='#0F0'
}
libLink.onmouseout = function () {
  this.style.color='#00F'
}

ස්නිපටය පුළුල් කරන්න

— user1476842
source

11

සීඑස්එස් හි වර්තමාන පුනරාවර්තනය සඳහා පේළිගත ව්‍යාජ පංති ප්‍රකාශන සඳහා සහය නොදක්වයි (කෙසේ වෙතත්, මා තේරුම් ගත් පරිදි, එය අනාගත අනුවාදයකින් පැමිණිය හැකිය).

දැනට, ඔබේ හොඳම ඔට්ටුව වන්නේ ඔබට විලාසිතාවට අවශ්‍ය සබැඳියට ඉහළින් කෙළින්ම විලාසිතාවක් අර්ථ දැක්වීම ය:

<style type="text/css">
    .myLinkClass:hover {text-decoration:underline;}
</style>
<a href="/foo" class="myLinkClass">Foo!</a>

— බ්‍රෙට්කෙලි
source

4

එම අදහස වාසනාවකට අත්හරිනු ඇත. ( "අතහැර දැමූ වැඩ කෙටුම්පත්" යටතේ ලැයිස්තු. W3.org/Archives/Public/www-style/2009Jun/0341.html බලන්න .)

— Ms2ger

3

අ. මෙම පිළිතුරෙහි නොමැත.

— ජොයෙල්

9

පෙන්වා දී ඇති පරිදි, ඔබට හෝවර් සඳහා අත්තනෝමතික පේළි සැකසිය නොහැක, නමුත් ඔබට සුදුසු ටැගයේ පහත සඳහන් දෑ භාවිතා කරමින් CSS හි හෝවර් කර්සරයේ විලාසය වෙනස් කළ හැකිය :

style="cursor: pointer;"

— රදෆර්ඩ්
source

2

එය හොඳම පිළිතුර විය යුතුය

— ව්ලැඩිස්ලාව් ගුලෙව්

6

<style>a:hover { }</style>
<a href="/">Go Home</a>

හොවර් යනු ව්‍යාජ පංතියක් වන අතර එමඟින් ශෛලීය ලක්ෂණයක් සමඟ යෙදිය නොහැක. එය තේරීම් කාරකයේ කොටසකි.

— ජොයෙල්
source

2

Interest තවමත් උනන්දුවක් දක්වන / කියවන ඕනෑම කෙනෙකුට ඩෙරෙක්: "~ /" (ටිල්ඩ් ෆෝවර්ඩ් ස්ලෑෂ්) යනු asp.net වෙබ් යෙදුම්වල යෙදුම් මූලයට සේවාදායක පාර්ශවීය යොමු කිරීමකි. (යෙදුම් මූල පා course මාලාවේ උප ෆෝල්ඩරයක් විය හැකිය). මෙහි එය භාවිතා කිරීම නිවැරදි නොවනු ඇත, එබැවින් ඔබ ප්‍රශ්නය ඇසූ දා සිට පිළිතුර සංස්කරණය කිරීමට හේතුව (මම සැක කරමි).

— ක්‍රිස්

5

ඔබට මෙය කරන්න පුළුවන්. නමුත් පේළිගත මෝස්තර වලින් නොවේ. ඔබට භාවිතා කළ හැකි onmouseoverසහ onmouseoutසිදුවීම්:

<div style="background: #333; padding: 10px; cursor: pointer"
   onmouseover="this.style.backgroundColor='#555';" onmouseout="this.style.backgroundColor='#333';">
      Hover on me!
</div>

ස්නිපටය පුළුල් කරන්න

4

ඔබගේ අදහස් වලට අනුව, ඔබ කෙසේ හෝ ජාවාස්ක්‍රිප්ට් ගොනුවක් යවයි. ජාවාස්ක්‍රිප්ට් හි පෙරළීම කරන්න. අනෙක් සෑම ජාවාස්ක්‍රිප්ට් එතීම මෙන් jQuery හි $.hover()ක්‍රමය පහසු කරයි. Java ජාවාස්ක්‍රිප්ට් වලද එය එතරම් අපහසු නැත.

— විනීල් ෂා
source

මෙය අවට වැඩක් වන නමුත් එය මට ඉතා හොඳ පිළිතුරක් සපයන අතර

— ඉන්ලයින් හෝවර්

4

මෙය කිරීමට ක්රමයක් නොමැත. ඔබේ විකල්පයන් වන්නේ ජාවාස්ක්‍රිප්ට් හෝ CSS බ්ලොක් එකක් භාවිතා කිරීමයි.

සමහර විට ජාවාස්ක්‍රිප්ට් පුස්තකාලයක් ඇති අතර එය හිමිකාර ශෛලීය ගුණාංගයක් ශෛලමය කොටසකට පරිවර්තනය කරයි. නමුත් එවිට කේතය සම්මත අනුකූල නොවේ.

— m_vitaly
source

2

මම වෙනස් විසඳුමක් හදුනා ගත්තා.

මගේ ගැටළුව: <a>සමහර විනිවිදක / ප්‍රධාන අන්තර්ගත නරඹන්නා වටා ටැගයක් මෙන්ම <a>පාදකයේ ටැග් ද ඇත. මට අවශ්‍ය වන්නේ ඔවුන් IE හි එකම ස්ථානයකට යාමටයි, එබැවින් onHoverඔවුන් සබැඳි නොවුනත් මුළු ඡේදයම ඉස්මතු වනු ඇත : සමස්තයක් ලෙස විනිවිදකය සබැඳියකි. IE වෙනස දන්නේ නැහැ. මගේ පාදකයේ යටි ඉරි සහ වර්ණ වෙනස් කිරීම අවශ්‍ය වන සත්‍ය සබැඳි කිහිපයක් ද මා සතුව ඇත onHover. වර්ණ වෙනස් කිරීම සඳහා පාදක ටැග් සමඟ මෝස්තර තැබිය යුතු යැයි මම සිතුවෙමි, නමුත් ඉහත උපදෙස් වලින් පෙනී යන්නේ මෙය කළ නොහැකි බවයි.

විසඳුම: මම පාදක සබැඳි විවිධ පන්ති දෙකක් ලබා දුන් අතර මගේ ගැටළුව විසඳුණි. onHoverඑක් පන්තියක වර්ණ වෙනස් කිරීමට මට හැකි විය , විනිවිදකවල onHoverවර්ණ වෙනසක් / යටි ඉරි ඇඳීමක් නොතිබුණි, සහ තවමත් පාදයේ සහ විනිවිදකවල බාහිර HREFS එකම වේලාවක තබා ගැනීමට හැකි විය!

— ලිස්
source

1

මම සෙවනැල්ල සමඟ එකඟ වෙමි . ජාවාස්ක්‍රිප්ට් හරහා CSS වෙනස් කිරීමට ඔබට onmouseoverසහ onmouseoutසිද්ධිය භාවිතා කළ හැකිය.

ජාවාස්ක්‍රිප්ට් සක්‍රීය කිරීමට මිනිසුන්ට අවශ්‍ය යැයි නොකියන්න. එය විලාසිතාවේ ප්‍රශ්නයක් පමණි, එබැවින් ජාවාස්ක්‍රිප්ට් නොමැතිව සමහර අමුත්තන් සිටීද යන්න ගැටළුවක් නොවේ;) බොහෝ වෙබ් 2.0 ජාවාස්ක්‍රිප්ට් සමඟ ක්‍රියා කළද . බලන්න ෆේස්බුක් උදාහරණයක් (ජාවාස්ක්රිප්ට් ගොඩක්) හෝ Myspace .

— ජේස්න්
source

0

මෙය ක්‍රීඩාවේ ප්‍රමාද වැඩියි, නමුත් ඔබ HTML විද්‍යුත් තැපෑලක ජාවාස්ක්‍රිප්ට් භාවිතා කරන්නේ කවදාද? උදාහරණයක් ලෙස, මම දැනට සේවය කරන සමාගමෙහි (ඇබොඩී සමඟ රයිම්), බොහෝ විද්‍යුත් තැපැල් අලෙවිකරණ ව්‍යාපාර සඳහා අපි අඩුම පොදු හරය භාවිතා කරමු - සහ ජාවාස්ක්‍රිප්ට් භාවිතා නොකෙරේ. කවදා හෝ. ඔබ යම් ආකාරයක පෙර සැකසුම් ගැන සඳහන් නොකරන්නේ නම්.

අදාළ පෝස්ට් එකක සඳහන් කර ඇති පරිදි: "නෙළුම් සටහන්, මොසිල්ලා තණ්ඩර්බර්ඩ්, අවුට්ලුක් එක්ස්ප්‍රස් සහ වින්ඩෝස් ලයිව් මේල් සියල්ලම යම් ආකාරයක ජාවාස්ක්‍රිප්ට් ක්‍රියාත්මක කිරීමට සහාය දක්වන බව පෙනේ. වෙන කිසිවක් නැත."

මෙය ලබාගත් ලිපියට සබැඳිය: [ http://en.wikipedia.org/wiki/Comparison_of_e-mail_clients]

එසේම, සැරිසැරීම ජංගම උපාංගවලට පරිවර්තනය කරන්නේ කෙසේද? ඉහළ සිට පිළිතුරට මා කැමති වන්නේ එබැවිනි.Long answer: you shouldn't.

යමෙකුට මෙම විෂය පිළිබඳ වැඩි අවබෝධයක් තිබේ නම්, කරුණාකර මාව නිවැරදි කිරීමට නිදහස් වන්න. ඔබට ස්තුතියි.

— ෂෝන් ස්පෙන්සර්
source

0

එබැවින් මෙය පරිශීලකයා සොයන තරමට නොවේ, නමුත් මම මෙම ප්‍රශ්නයට පිළිතුරක් සොයමින් හමු වූ අතර ඒ හා සම්බන්ධ යමක් ඉදිරිපත් කළෙමි. ඒවා තුළ ටැබ් එකක් සඳහා නව වර්ණයක් / සැරිසැරීමක් අවශ්‍ය වන පුනරාවර්තන අංග රාශියක් මා සතුව තිබුණි. මම හසුරුව භාවිතා කරමි, එය මගේ විසඳුමට ප්‍රධාන වේ, නමුත් වෙනත් සැකිලි භාෂා ද ක්‍රියා කරයි.

මම වර්ණ කිහිපයක් නිර්වචනය කර ඒවා එක් එක් මූලද්‍රව්‍යය සඳහා හැන්ඩ්බාර් අච්චුවට ඇතුළත් කළෙමි. අච්චුවේ ඉහළින්ම මම විලාසිතාවේ ටැගයක් නිර්වචනය කර මගේ අභිරුචි පන්තියට දමා වර්ණ වර්ණය කරන්න.

<style type="text/css">
    .{{chart.type}}-tab-hover:hover {
        background-color: {{chart.chartPrimaryHighlight}} !important;
    }
</style>

ඉන්පසු මම අච්චුවේ ශෛලිය භාවිතා කළෙමි:

<span class="financial-aid-details-header-text {{chart.type}}-tab-hover">
   Payouts
</span>

ඔබට අවශ්‍ය නොවනු ඇත !important

— වෙබ්හවුන්ඩ්
source

0

ඔබට විවිධ වර්ගයේ කේතයක් ලිවිය හැකිය

මුලින්ම මට මෙය ලිවිය හැකිය

html

<a href="https://www.google.com/" onMouseOver="this.style.color='red'"
        onMouseOut="this.style.color='blue'" class="one">Hello siraj</a>

css

.one{
  text-decoration: none;
}

ඔබට වෙනත් ක්‍රමයක් උත්සාහ කළ හැකිය

html

<a href="https://www.google.com/" class="one">Hello siraj</a>

css

.one{
text-decoration: none;
}

.one:hover{
color:blue;
}

.one:active{
color: red;
}

ඔබට jquery හි සැරිසැරීමට උත්සාහ කළ හැකිය

java ස්ක්‍රිප්ට්

$(document).ready(function(){
  $("p").hover(function(){
    $(this).css("background-color", "yellow");
    }, function(){
    $(this).css("background-color", "pink");
  });
});

html

<p>Hover the mouse pointer over this paragraph.</p>

මෙම කේතයේ ඔබට jquery හි ශ්‍රිත තුනක් ඇත, පළමුව ඔබ jquery හි ක්‍රියාකාරීත්වයේ මූලික වන ශ්‍රිතයක් සූදානම් කළ අතර දෙවනුව ඔබ මෙම ශ්‍රිතයේ හෝවර් ශ්‍රිතයක් පෙළට යොමු කළ විට ඔබ පෙළට දර්ශකයක් එබූ විට වර්ණය වෙනස් වන අතර ඊළඟට ඔබ දර්ශකය පෙළට මුදා හරින විට එය වෙනස් වර්ණයක් වනු ඇති අතර මෙය තුන්වන ශ්‍රිතය වේ

— සිරාජ් අහමඩ්
source

කරුණාකර අනුපිටපත් පළ කිරීමෙන් වළකින්න

— සිමාස් ජොනෙලියුනාස්

මෙම කිසිදු ප්‍රවේශයක් ප්‍රශ්නයේ ප්‍රකාශිත ගැටළුව විසඳන්නේ නැත. ඔබට HTML හැඩතල ගැන්වූ විද්‍යුත් තැපෑලක JS භාවිතා කළ නොහැක, ඔබ යෝජනා කරන අනෙක් ප්‍රවේශය පැහැදිලිවම බැහැර කර ඇති පන්ති භාවිතා කරයි.

— ක්වෙන්ටින්

0

එය දැන් හැක්ස් සමඟ කළ හැකිය .

— නික් සෝන්ඩර්ස්
source

-1

මට ජාවාස්ක්‍රිප්ට් වළක්වා ගැනීමට සිදු විය, නමුත් සේවාදායක පැත්තේ කේතය සමඟ යා හැකිය.

ඒ නිසා මම හැඳුනුම්පතක් ජනනය කළා, ස්ටයිල් බ්ලොක් එකක් නිර්මාණය කළා, එම හැඳුනුම්පත සමඟ සබැඳිය ජනනය කළා. ඔව් එහි වලංගු HTML.

a {
  text-decoration: none;
  color: blue; 
}

a:hover {
  color: blue;
  font-weight: bold;
}

<!-- some code in the interpreter you use, to generate the data-hover id -->
<style>
  a[data-hover="rnd-id-123"] { color: green;  } 
  a[data-hover="rnd-id-123"]:hover { color: red; }
</style>
<a data-hover="rnd-id-123">some link 1</a>

<br>

<!-- some code in the interpreter you use, to generate the data-hover id -->
<style>
  a[data-hover="rnd-id-456"] { color: purple;  }
  a[data-hover="rnd-id-456"]:hover { color: orange; }
</style>
<a data-hover="rnd-id-456">some link 2</a>

ස්නිපටය පුළුල් කරන්න

— කෙසෙල් ඇසිඩ්
source

-2

ව්‍යාජ පන්තිය a:hoverබාහිර විලාසිතාවේ තහඩු වලින් පමණක් භාවිතා කළ හැකිය . එබැවින් බාහිර මෝස්තර පත්‍රිකාවක් භාවිතා කිරීමට මම නිර්දේශ කරමි. කේතය:

a:hover {color:#FF00FF;}   /* Mouse-over link */

— user1466310
source

නිසැකවම ඔබට බාහිර තහඩු අවශ්‍ය නැත, styleටැගය භාවිතා කරන්න .

— දිමිත්‍රි සයිට්සෙව්

-2

පංතියක් එකතු කිරීමෙන් ඔබට හැඳුනුම්පත කළ හැකි නමුත් කිසි විටෙකත් පේළිගත නොවේ.

<style>.hover_pointer{cursor:pointer;}</style>
<div class="hover_pointer" style="font:bold 12pt Verdana;">Hello World</div>

පේළි 2 ක් නමුත් ඔබට සෑම තැනකම පන්තිය නැවත භාවිතා කළ හැකිය.

— දෝෂය
source

-3

මගේ ගැටළුව වූයේ මම රූපයක්-නිරූපක විශාල ප්‍රමාණයක් භාවිතා කරන වෙබ් අඩවියක් තැනීමයි. එය වෙනත් රූපයකින් හෝවර් මත මාරු කළ යුතුය (උදා: නිල්-ඊෂ් රූප රතු-ඊෂ් හොවර් මත හැරේ). මේ සඳහා මම පහත විසඳුම ඉදිරිපත් කළෙමි:

.container div {
  width: 100px;
  height: 100px;
  background-size: 100px 100px;
}
.container:hover .withoutHover {
  display: none;
}
.container .withHover {
  display: none;
}
.container:hover .withHover {
  display: block;
}

<p>Hover the image to see it switch with the other. Note that I deliberately used inline CSS because I decided it was the easiest and clearest solution for my problem that uses more of these image pairs (with different URL's).
</p>
<div class=container>
<div class=withHover style="background-image: url('https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcQrqRsWFJ3492s0t0NmPEcpTQYTqNnH188R606cLOHm8H2pUGlH')"></div>
<div class=withoutHover style="background-image: url('http://i.telegraph.co.uk/multimedia/archive/03523/Cat-Photo-Bombs-fa_3523609b.jpg')"></div>
</div>

රූප යුගල අඩංගු කන්ටේනරයක් මම හඳුන්වා දුන්නා. පළමුවැන්න දෘශ්‍යමාන වන අතර අනෙක සැඟවී ඇත (දර්ශනය: කිසිවක් නැත). කන්ටේනරයෙහි සැරිසරන විට, පළමුවැන්න සැඟවී ඇත (දර්ශනය: කිසිවක් නැත) සහ දෙවැන්න නැවත දර්ශනය වේ (දර්ශනය: වාරණය).

— ජොකෙම් ගුසෙන්ස්
source

ලියන්නේ කෙසේද: පේළියේ CSS තුළ සැරිසරන්න?

Javascript භාවිතා කරමින්: