2013-12-06 3 views
0

у меня есть:как сделать DIV вне SVG unclickable

<div id="workarea"> <style id="styleoverrides" type="text/css" media="screen" scoped="scoped"></style> <div id="svgcanvas" style="position:relative"> </div> </div> 

и внутри Div Ид svgcanvas я порождающих SVG имени: svgroot

Проблема заключается в том, что я хочу, чтобы пользователь щелкните svgcanvas и его svg, но вне svgcanvas в workarea я должен иметь unclickable.

для этого я сделал:

#svgcanvas { 
     line-height: normal; 
     display: inline-block; 
     background-color: #A0A0A0; 
     text-align: center; 
     vertical-align: middle; 
     width: 640px; 
     height: 480px; 
     -apple-dashboard-region:dashboard-region(control rectangle 0px 0px 0px 0px); /* for widget regions that shouldn't react to dragging */ 
     position: relative; 
     /* 
      A subtle gradient effect in the canvas. 
      Just experimenting - not sure if this is worth it. 
     */.... so on 
    } 

и

#workarea { 
    display: inline-table-cell; 
    position:absolute; 
    top: 40px; 
    left: 40px; 
    bottom: 40px; 
    right: 14px; 
    background-color: #A0A0A0; 
    border: 1px solid #808080; 
    overflow: auto; 
    text-align: center; 

} 

Я также использовал pointer-events: none; в #workarea но и сделать svgcanvas unclickable. Я хочу иметь рабочую область без привязки, а svgcanvas - кликабельную.

+0

В чем проблема с нажатием на div? – Aeolun

+0

Проблема в том, что мое изображение находится только на svgcanvas, и если кто-то щелкнет снаружи, он также выйдет за рамки картинки, которую я не хочу. – Zeeshan

ответ

0

Вы можете сделать это, я думаю,

#workarea{ cursor: default; }

#svgcanvas { cursor:pointer; }

$("#svgcanvas").click(function() { //do your stuff });

+0

Это обходная или рабочая область? – Zeeshan

+0

работаarea. Я исправил это. –

+0

Он не работает и показывает тот же ответ, как я нажимаю холст или рабочую область, он выполняет функцию – Zeeshan

0

Возможно, <area shape="rect" coords="27,67,435,267" */insert cords of div here/* href="" alt="" title=""> может помочь?

+0

Я думаю, что это решение не поможет, так как мой размер деления не фиксирован, а также у меня есть разделение внутри него, которое я хочу щелкнуть – Zeeshan

0

Не является ли это просто CSS?

pointer-events: none; 
Смежные вопросы