php - How to change the color of a slicing area using onMouseOver and onmouseout using javascript? -


i have sliced image , devided image in different images. have posted dummy image better understanding left side image present state , expecting output right side image. want change color of slice image on mouseover , onmouseout event,and want use onmousedown event other purpose image.

enter image description here

below code:-

<!doctype html> <html>     <head>         <meta charset="utf-8">         <title>untitled document</title>     </head>     <style>         aaa:hover {             color:red;         }     </style>     <body>         <script>             var sundarg;             sundarg =   document.getelementbyid('sundarg');              function mouseinaa()             {                 sundarg.style.display="#ff0000";             }              function mouseoutaa()             {                 sundarg.style.display="#ffffff";             }            </script>         <img src="image/map3.png" usemap="#map" />         <map name="map">          <area shape="poly"  id="sundarg" coords="226,75,228,70,228,65,228,61,229,57,232,52,234,49,239,46,243,45,246,43,248,41,252,39,254,39,256,38,259,36,260,36,260,34,261,32,259,30,258,29,258,26,257,25,260,25,261,25,263,26,265,28,266,29,266,31,267,32,268,35,269,36,271,37,272,37,276,39,283,40,284,40,282,39,284,38,288,37,292,37,292,36,296,34,299,34,302,33,305,33,308,32,310,33,312,33,314,32,317,32,320,31,322,31,326,30,328,31,329,31,330,33,331,35,331,38,331,39,332,42,331,49,330,50,325,55,322,56,327,56,330,55,332,56,334,58,336,58,338,59,340,60,340,61,341,63,342,65,342,67,342,67,344,67,345,67,347,67,348,68,350,70,351,73,347,74,341,74,340,76,340,79,337,83,339,87,337,91,335,91,333,90,326,87,318,86,313,85,311,85,309,84,301,81,298,79,296,78,295,76,293,73,293,70,293,68,294,65,294,64,293,60,293,58,293,56,293,55,291,53,290,52,287,50,286,50,282,50,280,53,278,54,276,55,276,57,275,58,275,60,275,62,274,61,270,63,268,63,266,62,264,62,261,63,258,65,256,66,254,65,251,63,244,66,248,67,246,69,243,71,241,72,238,74,237,75,234,75,232,76,231,76,226,76,225,76,227,74,259,53,228,73,229,72" onmouseover="mouseinaa()" onmouseout="mouseoutaa()" >         </map>     </body> </html>


Comments

Post a Comment

Popular posts from this blog

get url and add instance to a model with prefilled foreign key :django admin -

Image
i have page in each contest shown in row. each row contains contest id , link other model names have foreign key contest. news model: class news(models.model): title = models.charfield(max_length=50, null=true) description = models.textfield() time = models.timefield( default= datetime.datetime.now().time()) contest = models.foreignkey(contest) i want use admin adding , changing these models. want when user clicks on 'news' has foreign key contest id=1, shows list of news value foreign key. use {% instance in instances %} <tr class="{% cycle 'row1' 'row2' %}"> <td>{{ instance.title }}</td> <td>{{ instance.starttime }}</td> <td>{{ instance.timespan }}</td> <td>{{ instance.date }}</td> <td><a href="/adm...
Read more

android - Keyboard hides my half of edit-text and button below it even in scroll view -

i having trouble keyboard covers edit-text , half of button in scroll view. here's layout , please tell me how should resolve problem. many questions on topic none of them s working me. <?xml version="1.0" encoding="utf-8"?> <linearlayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:background="@drawable/bg" android:layout_height="match_parent"> <scrollview android:layout_width="match_parent" android:fillviewport="true" android:layout_height="match_parent"> <relativelayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical"> <linearlayout android:layout_width="match_parent" android:layout_height="w...
Read more

css - Make div keyboard-scrollable in jQuery Mobile? -

from can tell, although jquery-mobile-powered pages can contain divs overflow set scroll or auto, , these divs can scrolled one-screen bar or mouse wheel, cannot scrolled using arrow keys, page-up/page-down, or home/end. instead, official "page" div (with data-role="page") absorbs input. perhaps other divs can't acquire focus, i'm not sure. is there way around this? edit: jsfiddle of simple example: https://jsfiddle.net/qogz0shx/ <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquerymobile/1.4.5/jquery.mobile.min.js"> </script> <link rel="stylesheet" href="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.css"/> <style> #outer { overflow:scroll; height: 50vh; width: 50vw; } #inner { height: 500vh; width: 500vw; } ...
Read more