не могу разрешить путь к PIE.htc - PullRequest
0 голосов
/ 14 февраля 2012

Я пытаюсь интегрировать css3pie с приложением Grails.В соответствии с инструкциями все, что мне нужно сделать, это:

  • поместить файл PIE.htc где-нибудь на сервере
  • и добавить следующее к каждому соответствующемуПравило CSS behavior: url(path/to/PIE.htc);

Чтобы упростить определение пути к PIE.htc, я поместил файл в web-app/js/PIE.htc.Затем я определил следующее сопоставление URL

"/PIE.htc"(controller: 'home', action: 'css3pie')

, которое обрабатывается действием:

class HomeController implements ApplicationContextAware {

    private ResourceLoader resourceLoader

    void setApplicationContext(ApplicationContext applicationContext) {
        this.resourceLoader = applicationContext
    }

    def css3pie() {
        log.debug "css3pie HTC file requested"
        Resource pieHTC = resourceLoader.getResource('/js/PIE.htc')
        response.contentType = 'text/x-component'
        response.outputStream << pieHTC.file.text
        response.outputStream.flush()
    }
}

Если вы перейдете на http://summer -festivals.cloudfoundry.com / PIE.htc файл обслуживается, поэтому кажется, что все работает.Затем я добавил свойство behavior в несколько правил CSS, чтобы посмотреть, работает ли оно, например,

.roundBottomLeft {
    border-bottom-left-radius: 10px;
    -moz-border-radius-bottomleft: 10px;
    behavior: url(/PIE.htc);
}

.roundBottomRight {
    border-bottom-right-radius: 10px;
    -moz-border-radius-bottomright: 10px;
    behavior: url(/PIE.htc);
}

. Это должно закруглить нижний правый и нижний левый углы меню, но если вы просматриваете домашняя страница в IE8 вы можете видеть, что она не работает.

Кажется, есть проблема с разрешением пути к файлу PIE.htc, потому что я установил точку останова в действии css3pie выше, но точка останова никогда не достигается.Почему путь к PIE.htc не разрешен.

Ответы [ 2 ]

1 голос
/ 19 июня 2012

Попробуйте, я только что немного изменил ваш код:

URLMappings.groovy

class UrlMappings {
    static mappings = {
        "/$controller/$action?/$id?"{
            constraints {
                // apply constraints here
            }
        }
        "/"(controller:'home')
        "500"(view:'/error')
        "403"(view:'/login/denied')
        "/static/PIE.htc"(controller: 'home',action: 'css3pie') // <== see here
    }
}

HomeController.groovy

import grails.plugins.springsecurity.Secured
import org.springframework.core.io.Resource

@Secured("IS_AUTHENTICATED_FULLY")
class HomeController {

    def grailsApplication

    def index = { }

    def css3pie() {
        Resource pieHTC = grailsApplication.mainContext.getResource('css/PIE.htc') // <== see here
        response.contentType = 'text/x-component'
        response.outputStream << pieHTC.file.text
        response.outputStream.flush()
    }
}
1 голос
/ 14 февраля 2012

Согласно документации, PIE распознает только сокращенные стили.Поэтому вам необходимо использовать border-radius со стенографическими значениями для каждого угла, а не отдельные свойства border-xy-radius.

http://css3pie.com/documentation/known-issues/#shorthand

http://css3pie.com/documentation/supported-css3-features/#border-radius

...