Как создать плавное трапециевидное изображение с помощью CSS?

Я работаю над веб-сайтом, на котором мы используем эффект параллакса. В этом есть некоторые изображения, которые имеют форму треугольника, как это

, и изображение прозрачно, потому что оно перекрывает вышеупомянутый DIV. Я пробую так много вещей с css. но не получил желаемого результата. Я достигаю желаемого результата с фиксированной шириной. Проверьте это http://jsfiddle.net/eJ7Sf/2/, но оно не работает с плавной шириной. Проверьте, что я все еще пытаюсь, но не работает

http://jsfiddle.net/ceGGN/3/

http://jsfiddle.net/eJ7Sf/1/

ПРИМЕЧАНИЕ: я знаю о css3 MASK, но оно не работает в предыдущих браузерах Firefox. Мне нужна возможность до Firefox 3.6.13