Comments (11)
subtleGradient
commented on August 28, 2024
If you do decide to do this please make the selector engine modular. E.g. Use MooTools or jQuery selector engines if they are already available on the page.
If you do include a selector engine to include in the source, be sure to check the latest results of the SlickSec cross-library selector engine test suite.
http://github.com/mootools/slick
from pie.
hbchai
commented on August 28, 2024
We would really love to see the standalone javascript feature. We're facing a problem using PIE in an IE browser control that loads content without setting its URL. Its URL remains about:blank, and any attempt to load HTC's results in access denied script errors. Exposing a javascript method sounds like a suitable workaround for us.
Any idea how much work is left to complete this item, or what I can do to help?
from pie.
lojjic
commented on August 28, 2024
@hbchai: Most of the work is already done, and the build script now produces a PIE.js in addition to PIE.htc.
The part that is remaining is deciding what public API is going to be available for hooking up elements. Right now, there are only two public methods: PIE.attach and PIE.detach, both of which accept a single element reference as argument (see http://github.com/lojjic/PIE/blob/master/sources/PIE_API.js). This is obviously very limited and pretty inconvenient for users. We definitely want something more powerful and convenient; I see a couple decent options:
A) Expose something similar to what DD_roundies does, where the user calls a public method passing it a selector or set of selectors. A downside to this is that the user has to maintain the PIE initialization code in JS separately from the CSS.
B) Have users invoke a CSS expression which initializes PIE on the element (PIE would then clear the expression right away to prevent continual evaluation) -- this would look something like: behavior:expression(PIE.attach(this));
It's of course possible to do both. If anyone has better suggestions I'd love to hear them. :)
I should also mention the big downside to any of these approaches: unlike .htc there is no way I'm aware of to automatically clean up the PIE rendering when the target element is removed from the DOM. That would have to be a manual process and would make PIE pretty tough to use in highly dynamic DOMs.
from pie.
hbchai
commented on August 28, 2024
The HTC approach is certainly the most elegant, and I wish we could use it. :)
Approach B) certainly sounds interesting as a more user-friendly way of exposing the API. Behaviors were completely new to me before encountering PIE - and now this expression syntax is completely fresh too.
I tried a simple test using PIE.attach() from the latest code. The div that I'm testing gets rounded borders, but also unexpectedly turns black (at least in IE8, so far). Is this due to a different issue? Here's my test:
<html>
<head>
<style type="text/css">
#testbox {
position: absolute;
top: 50px;
left; 50px;
width: 400;
height: 300;
background-color: orange;
/* ??? */
border-radius: 16px;
}
</style>
<!-- <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script> -->
<script type="text/javascript" src="PIE.js"></script>
<script type="text/javascript">
// foo
</script>
</head>
<body>
<input type="button" onclick="PIE.attach(document.getElementById('testbox'));" value="Attach!" />
<input type="button" onclick="PIE.detach(document.getElementById('testbox'));" value="Detach!" />
<div id="testbox">
Some Text Inside
</div>
</body>
from pie.
lojjic
commented on August 28, 2024
Try using a color other than 'orange'... VML only supports a subset of CSS color keywords and I think orange is not one of them. See if a hex value works.
from pie.
hbchai
commented on August 28, 2024
You're right - changing the color worked! Thanks!
from pie.
lojjic
commented on August 28, 2024
Regarding my prior suggestion of using css expressions to invoke the JS attach method (option B)... I just remembered that expressions are not supported in IE8 standards mode, so this is not a viable option for users.
from pie.
JamieS
commented on August 28, 2024
Any word on the development of a non htc version of css3pie? I almost always use a CDN for asset delivery and htc files do not work on an external domain.
from pie.
lojjic
commented on August 28, 2024
@JamieS: http://css3pie.com/documentation/pie-js/ -- it's been included since beta3. The API is currently very rudimentary, so this ticket is just kept open to track improving that. But it should be usable.
from pie.
JamieS
commented on August 28, 2024
Great! I'll add feedback today if I see a need. Thanks for the quick reply!
from pie.
lojjic
commented on August 28, 2024
I'm closing this as finished, as the standalone JS has been part of the build since beta3 and I think the current API, though extremely simplistic, seems to be sufficient for most needs.
from pie.
Related Issues (20)
- Gradient upside down in IE8 (not IE9)
- [enhancement] Add missing bower.json.
- Pie is not working for dynamic content in IE8 HOT 2
- Filter: gardient for IE9 crashes border-radius in IE8 HOT 1
- CSS3Pie Gradients not working on ASPX page but displaying on MVC page HOT 1
- PIE causing hover effect delay in IE8 HOT 1
- Background disappears. At least in IE8 HOT 1
- Box shadown not working in IE8 , IE7 , IE6
- PIE 2 has js errors in IE8 HOT 4
- PIE 2 adds unecessary %22 before and after -pie-load-path HOT 2
- A problem in https protocol
- use PIE with E:hover,It
- use PIE with E:hover, element jitter occurs in IE HOT 2
- JQuery will thrown Error when use PIE. IE
- Feature: CSS3 3D Transformation HOT 5
- PIE background scrolls doubly in IE8 Standards mode HOT 4
- missing PIE.htc file HOT 1
- PostCSS plugin for you !!! easy to add PIE in your css HOT 1
- I can't find pie.htc under which folder HOT 1
- PIE don't work in IE8 HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from pie.