Форум программистов
 

Восстановите пароль или Зарегистрируйтесь на форуме, о проблемах и с заказом рекламы пишите сюда - alarforum@yandex.ru, проверяйте папку спам!

Вернуться   Форум программистов > Web программирование > HTML и CSS
Регистрация

Восстановить пароль
Повторная активизация e-mail

Купить рекламу на форуме - 42 тыс руб за месяц

Ответ
 
Опции темы Поиск в этой теме
Старый 09.08.2019, 14:48   #1
s88s
Форумчанин
 
Регистрация: 02.01.2014
Сообщений: 369
По умолчанию Кроссбраузерность svg

Доброго времени суток!

Надеюсь что я написал в правильный раздел.

У меня есть рулетка на сайте вопросов к работе рулетки нет вот только не задача заключается в том что в мозилле отображение данной рулетки не много не правильная

rulletka-1.png

В других браузерах а именно проверял в Опере, Хроме и в IE все отображается нормально

rulletka-2.png

Вопрос как сделать что бы в мозилле все так же корректно отображалось

Скажу сразу код писал не я хочу просто исправить в мозилле отображение

Код:

<style type="text/css">
.left-bar
{
    margin-left: -4%;
    width: 110%;
    height: 100%;
    position: relative;
}
.spinBtn
{
  position: absolute;
  z-index: 999;
}
</style>
<div class="left-bar">
<div class="wheelContainer">

  <svg class="wheelSVG" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMidYMid meet" text-rendering="optimizeSpeed">
<defs>
<filter id="shadow" x="-100%" y="-100%" width="550%" height="550%">
  <feOffset in="SourceAlpha" dx="0" dy="0" result="offsetOut"></feOffset>        
  <feGaussianBlur stdDeviation="9" in="offsetOut" result="drop" />
<feColorMatrix in="drop" result="color-out" type="matrix"
      values="0 0 0 0   0
              0 0 0 0   0 
              0 0 0 0   0 
              0 0 0 .3 0"/>  
 <feBlend in="SourceGraphic" in2="color-out" mode="normal" />
</filter> 
</defs>
  <g class="mainContainer">   
    <g class="wheel"/>    
  </g> 
  <g class="centerCircle" />
    
  <g class="wheelOutline" />
    <g class="pegContainer" >
      <path  class="peg" fill="#97b95a" d="M22.139,0C5.623,0-1.523,15.572,0.269,27.037c3.392,21.707,21.87,42.232,21.87,42.232	s18.478-20.525,21.87-42.232C45.801,15.572,38.623,0,22.139,0z" /> 
    </g>
    <svg class="start" style="display: none;" width="165" height="165" x="430" y="65"><image width="165" height="165" xlink:href="../../js/r/starburst.png" /></svg>
<g class="valueContainer" />
<svg width="480" height="230" x="272" y="268">
    <defs>
        <clipPath id="circleView">
            <circle cx="240" cy="115" r="115" fill="#FFFFFF" />            
        </clipPath>
    </defs>
<image width="480" height="230" xlink:href="ССЫЛКА_НА_КАРТИНКУ" clip-path="url(#circleView)" />
 </svg>
</svg>
  <div class="toast" style="display: none;">
    <p/>
  </div>
</div>
</div>
"Я не волшебник, я только учусь"
s88s вне форума Ответить с цитированием
Старый 09.08.2019, 19:56   #2
Naive
Раздолбайских Дел
Старожил
 
Аватар для Naive
 
Регистрация: 22.05.2009
Сообщений: 3,828
По умолчанию

ну хрен так продебагаешь, собери фиддл
Alar, верни репу!
Naive вне форума Ответить с цитированием
Ответ


Купить рекламу на форуме - 42 тыс руб за месяц

Опции темы Поиск в этой теме
Поиск в этой теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Кроссбраузерность для IE>8 под XP Izhic HTML и CSS 3 15.05.2014 08:39
Кроссбраузерность JavaScript Wolfus JavaScript, Ajax 1 22.03.2012 21:37
Кроссбраузерность шрифтов 4e4en HTML и CSS 1 29.11.2010 14:25
Кроссбраузерность Lavr HTML и CSS 0 07.12.2009 11:00
Кроссбраузерность 418689322 HTML и CSS 1 20.11.2008 18:12